jQuery form not sending data - javascript

I am trying to make it so when a file is submitted, a form gets submitted. Currently the form is submitting (the page refreshes), however the form data isn't being sent.
Javascript:
$(function () {
$("#moreHomepageImages").change(function () {
//I tried all of the following, all don't work
$("#imageHomepageForm").submit();
//$("#imageHomepageForm")[0].submit();
//document.getElementById("imageHomepageForm").submit();
});
)};
Html:
<form id="imageHomepageForm" name="imageHomepageForm" enctype="multipart/form-data" action="add" method="post">
<input type="hidden" name="object" value="homepage">
<input type="hidden" name="object_id" value="0">
<label>Add More Images</label>
<input id="moreHomepageImages" type="file" name="images[]" multiple="multiple"/>
</form>
On the add page, I have
print_r($_POST);
print_r($_GET);
print_r($_FILES);
and they print 3 empty arrays. I can't figure out why the form data isn't being sent along with the request? When I add a submit button into the form and click it, the data is sent as it is supposed to,
If it matters, the form is inside a jQuery Tab (http://jqueryui.com/tabs/)
EDIT: The action attribute is not the issue since it works if I use a normal input button and click it, I am using codeigniter so I do not need .php

The issue had nothing to do with jQuery or my code, for some reason the MAX_FILE_UPLOAD in my local php config wasn't reading properly and the images I tried uploaded where > 2MB (the default) breaking the request payload...
As to why submitting the form via clicking a submit button works and submitting over jQuery didn't is beyond me...

Related

How to stop Redirecting a page when a form is submitted?

I'm using a form and when the form is submitted I used action attribute and called a server url where the form data gets saved
Here's how it looks :
<form name="example" action="webresources/data/update" method="post">
</form>
The above form when submitted updates the form data in to the server but at the same time it also takes me to the new page webresources/data/update which has nothing but server response
I don't want this response to be shown on the web page. The url should be called when the form is submitted and it should be on the same page without redirecting to a new page.
Is there any way to do this, I'm allowed to send the data only via form parameters.
Thank you in advance :)
Remove the action attribute in the form and put the button outside the form.
When onclick, make an ajax call.
<form>
stuff
</form>
<input type="button" onclick="ajax()">
<script>
function ajax(){}
</script>
<form name="example" action="webresources/data/update" method="post" onclick="return false">
</form>
Returning false will stop the page from reloading or refreshing.
I suggest that before you ask a question you do a quick google search because this was the first result that came up for me prevent form submit from redirecting/refreshing using javascript.

How to send only POST-data (via Button click) in webView without following link

I load a webpage in a webView. In onPageFinished(..) i run some javascript code, which finally clicks a submit button. So the webView sends Post data and get an answer and loads a new page. That works fine, but i dont need the new page, its just unnecessary network load. I only need to submit the data.
So is it possible to send only the submit without loading the new page? I know that i can send post data with HTTPConnection, but i dont know the header consistence exactly, so i cant set the params. Is there any possibility with JS/Webview to abort?
Edit: I cant override onPageStarted() in my WebViewClient and perform a view.stopLoading(), because the new URL is still the same. But the site appearance is quite different. So i have to stop loading before
HTML of the submit button:
<input type="submit" name="savechanges" class="btn btn-primary" value="Speichern">
and three aditional lines above
<input type="hidden" name="uid" value="390">
<input type="hidden" name="option" value="com_jevents">
<input type="hidden" name="task" value="dash.listprojects">
which meaning i dont know (site is made by Joomla)
You can simply create a "virtual form" and submit it, like:
var $form = $("");
... on click:
$form.submit();
Hope this helps
Ops its removing my html from inside $form, inside the jQuery selector there should be a form like "form method='post' action='{someurl}'" with angle braces opening and closing properly

Safari 7 infinite POST request

I've get stuck with such issue. I have a form. When user submits his data, I'm sending some data via post ajax request. On success I set some data to hidden form, which has action pointing to current url subdomain, but in fact to partner site url that is set over CNAME. Then I trigger jQuery submit event on this hidden form, so after response user is on partner site (hidden form has no target attribute). It works fine in any browser except Safari 7 on mac. It just load for infinite time.
Any help is appreciated.
Well, there's not much code. Onsuccess of I run this:
if (response.result === true) {
this.targets.login.$email.val(response.data.data.email);
this.targets.login.$password.val(response.data.data.password);
this.targets.login.$form.submit();
}
My hidden form looks like this:
<form action="http://someurlunderCNAME" method="POST">
<input type="hidden" name="_method" value="POST">
<input type="text" name="data[User][email]">
<input type="password" name="data[User][password]">
</form>
Ok, I've got it myself. The reason was triggering submit on form. And the 'correct' behaiviour is to trigger click on submit input (which, btw, should be added too)

How can I submit a form automatically (onevent) with javascript?

I'd like to be able to submit a form automatically on an event ( a generic form, for user tracking).
For example, create a POST to
http://www.example.com/index.php?option=track&variable=variable
application/x-www-form-urlencoded with stuff like
username=usernamestring
otherdata=otherdata_string
otherdata2=otherdata string 2
The actual string will be preformatted, though, because all it is is like a 'ping'.
It needs to be submitted onevent, with external js ( http://example.com/scripts/js.js )
What the hay should I do? This is getting annoying.
Update: I guess I didn't really make myself clear; I have a premade form that isn't supposed to display on the page; it needs to submit on an event. The form fields do not exist on the page; all I do is link to the script on the page and it executes onLoad.
POST uri: http://www.example.com/index.php?option=track&variable=variable
The arguments above (option=track and variable=variable) are not the form details (postdata).
The content type is application/x-www-form-urlencoded , and has the following keys/values.
username=usernamestring
otherdata=otherdata_string
otherdata2=otherdata string 2 (when encoded, the spaces get turned to %20's.)
I need a script that submits this when run.
You have to get the form object and call the submit(); function provided by HTMLFormObject.
document.getElementById('myForm').submit();
1) with the following, (while page is loaded), the form will be immediately autosubmited
<form action="post.php" name="FNAME" method="post">
<input type="text" name="example22" value="YOURVALUE" />
<input type="submit" />
</form>
<SCRIPT TYPE="text/JavaScript">document.forms["FNAME"].submit();</SCRIPT>
another formSubmit alternative - submits any script:
document.forms[0].submit();
2) or use button click after 2second:
<SCRIPT TYPE="text/JavaScript">setInterval(function () {document.getElementById("myButtonId").click();}, 2000);</SCRIPT>

Ajax login forms working with browser password remember features

I have an ajax based login form for my site and have noticed that browsers are not recognising it as a login form and are not remembering passwords for it to ease the user's login.
When the submit button is pressed the values and sent to serverside to check and a response is sent back. If the check passes the the session is set and the page performs a javascript redirect into the members area. The html is very simple and could be the cause of the problem.
HTML:
<input type='text' class='email'>
<input type='password' class='password'>
<a class='submitBtn'>SUBMIT</a>
Thanks guys!
I think I'll do it in another way.
Using a form to submit to a hidden iframe , so the window will act like ajax post(do not refresh the window) and the password remember feature will works
like
<form method="post" id="" action="checkDetail.php" target="myIframe">
<input type='text' class='email'>
<input type='password' class='password'>
<input type="submit" name="" value="" id="Submit"/>
</form>
<iframe name="myIframe" id="myIframe"></iframe>
in this way you have to change a little bit of your response code to notice iframe parent the submit result.
update
it will done automatically by browser. If a form specify 'target' attribute , and there is a iframe has a name attribute that exactly the same as the target attribute of the form, the form action will submit to the iframe.
so when your request is success , your response will appear in the iframe content. Try code like this in the response.
<?php
//php checks database here
?>
<script>
parent.formSuccess({
//your response infomation
});
</script>
and define a formSuccess method in the outer page to handle the submit callback
Found answer on stack : How can I get browser to prompt to save password?
My Version:
<form id='loginForm' target="passwordIframe" method='POST' action="blank.php">
<input name='email' type='text' st='Email'>
<input name='pass' type='password' st='Password'>
<button type='submit'>LOGIN</button>
</form>
<iframe id="passwordIframe" name="passwordIframe" style='display:none'></iframe>
I can confirm that this triggers the password remember features for Chrome (other browsers not yet tested). It is important that the action attribute points to a blank.php. I chose a blank php page and echoed out the $_POST array just to make sure that the values were being submitted via the form.
I will now implement this with my old code that simply uses javascript to pull the values out of the field and checks them via an ajax call. I wonder if I can do away with the submit button all together and just use javascript to submit the form?

Categories

Resources