How can I submit a form multiple times in a loop.
What I am trying to do is to post post data to some 3rd party API for SMS. Now this 3rd Party SMS gateway takes only 50 no. in one go and I have more than 50 mobile no.
for (int jj=0;jj<=5; jj++)
{
%>
<form name="f" id="ff" action=http://smswebsite.com/api.php >
<input type=text name=username value="amu" >
<input type=text name=password value="password" >
<input type=text name=source value="SenderID">
<input type=text name=dmobile value="917417010049" >
<input type=text name=message value="Testing All from hashmi, malik hayat" >
</form>
<script type="text/javascript">
document.getElementById("ff").submit();
</script>
<%
}
%>
Please help
What is the issue you are having????
3 problems I see
If a first time form is submitted the page will navigate away. so the next form may not get turn to be submitted.
I have noticed your form id remains the same, so there will be multiple forms with same id each time a loop is executed. append the jj counter value with form tag for id "ff"+jj and with javascript getElementById("ff"+jj).
Use ajax to post the form to so that your page may not navigate away.
Call ajax post when document read event is executed: because you might be submitting a form where as the page may not have been rendered yet.
$( document ).ready(function() {
// code to submit form through ajax
});
You can post it as an array.
<form name="f" id="ff" action=http://smswebsite.com/api.php >
for (int jj=0;jj<=5; jj++)
{
%>
<input type=text name="username[]" value="amu" >
<input type=text name="password[]" value="password" >
<input type=text name="source[]" value="SenderID">
<input type=text name="dmobile[]" value="917417010049" >
<input type=text name="message[]" value="Testing All from hashmi, malik hayat" >
<%
}
%>
</form>
<script type="text/javascript">
document.getElementById("ff").submit();
</script>
Related
I made a html and a php page. I put 3 images in html page showing different genre of movies- horror, fantasy, romance. I want the images to work as form submit button and should get redirected to the php page and the php page should get the genre of the image.
What I already tried- I tried lot of different things but nothing worked.
And I wonder how php page will take different inputs from different images using $_POST method.
Expected output-
Suppose if user clicked on image of genre 'horror', then in php page value of $genre should be Horror.
You can use an <img> tag inside a <button> element.
<form method="post">
<button name="genre" value="horror" type="submit"><img src="./img/horror.jpg"></button>
<button name="genre" value="comedy" type="submit"><img src="./img/comedy.jpg"></button>
</form>
You can access the value of the submit button in your PHP using $_POST['genre'] (or whatever the name attribute of your buttons is)
The images should have an href tag that redirects to your PHP page. Note that this method will mean that you should get the value through $_REQUEST variables and not POST or GET. For example lets say href='myphp.php?genre=horror'. and in the PHP file $genre = $_REQUEST['genre'];
You could try something similar to the following:
<input class='genre' type='image' src='/images/genres/horror.jpg' data-genre='horror' />
<input class='genre' type='image' src='/images/genres/sci-fi.jpg' data-genre='sci-fi' />
<input class='genre' type='image' src='/images/genres/chickflick.jpg' data-genre='chickflick' />
<script>
Array.prototype.slice.call( document.querySelectorAll('input.genre') ).forEach( function(input){
input.addEventListener('click', function(e){
e.preventDefault();
location.href='info.php?genre='+this.dataset.genre
});
})
</script>
Assign each input a dataset attribute which you query later in the click handler. That dataset value is then used to construct the url...
Alternatively a slightly different approach would be to POST the data by setting the value of a hidden field to the dataset attribute value- like:
<form name='genres' method='post'>
<input class='genre' type='image' src='/images/genres/horror.jpg' data-genre='horror' />
<input class='genre' type='image' src='/images/genres/sci-fi.jpg' data-genre='sci-fi' />
<input class='genre' type='image' src='/images/genres/chickflick.jpg' data-genre='chickflick' />
<input class='genre' type='image' src='/images/genres/thriller.jpg' data-genre='thriller' />
<input class='genre' type='image' src='/images/genres/adventure.jpg' data-genre='adventure' />
<input class='genre' type='image' src='/images/genres/period-drama.jpg' data-genre='period-drama' />
<input type='hidden' name='genre' />
</form>
<script>
let form=document.forms.genres;
let genre=form.genre;
Array.prototype.slice.call( document.querySelectorAll('input.genre') ).forEach( function(input){
input.addEventListener('click', function(e){
e.preventDefault();
/* set hidden input value */
genre.value=this.dataset.genre;
/* append the genre to the qction/querystring */
form.action='?genre='+this.dataset.genre;
/* go */
form.submit();
});
})
</script>
I have one page lets call it "X.php" that i use that calls another page "Y.php" with the xmlhttp.open() function.
At the moment i have a form in page Y.php, and i would like to prevent it from refreshing because once i click on the submit button, my form dissapear.
I tryed with Jquery 'event.preventDefault()' in page X.php but nevertheless it didnt work.
Does anyone know a solution?
while($row = mysql_fetch_array($query)) {
echo " <h2>Update your personal settings</h2>
<form action='' id='target' method='POST'>
Surname: <input type=text name='lid_voornaam' value='".$row['lid_voornaam']."'><br/>
Name: <input type=text name='lid_naam' value='".$row['lid_naam']."'><br/>
Email: <input type=text name='lid_email' value='".$row['lid_email']."'><br/>
<input type='submit' value='Whatever' id='test1'/>
</form>";
}
Java script:
<script type="text/javascript">
$(document).ready(function(){
$("#test1").click(function(event){
event.preventDefault();
});
});
In your form tag. Add onSubmit="return false;
<form action='' id='target' method='POST' onSubmit="return false;>
Surname: <input type=text name='lid_voornaam' value='".$row['lid_voornaam']."'><br/>
Name: <input type=text name='lid_naam' value='".$row['lid_naam']."'><br/>
Email: <input type=text name='lid_email' value='".$row['lid_email']."'><br/>
<input type='submit' value='Whatever' id='test1'/>
</form>
As #andrew mentions. Your php script will generate multiple <form> tags which will all have the same id id='target'. This can cause problems on your page as that isnt valid html
I would have thought that the javascript you posted should work actually.
But if this is your actual code I suspect it fails because all of the submit buttons on all forms have id='test1' and id should be unique
Try like this:
$i=0;
while($row = mysql_fetch_array($query)) {
echo " <h2>Update your personal settings</h2>
<form action='' id='target."$i++".' method='POST'>
Surname: <input type=text name='lid_voornaam' value='".$row['lid_voornaam']."'><br/>
Name: <input type=text name='lid_naam' value='".$row['lid_naam']."'><br/>
Email: <input type=text name='lid_email' value='".$row['lid_email']."'><br/>
<input type='submit' value='Whatever' id='test1'/>
</form>";
}
and
$("form").submit(function(event){
var id = $(this).attr('id').split('target')[1];
alert('form ' +id+ ' clicked');
event.preventDefault();
});
I want to submit Multiple Forms with 1 button and 1 action target using PHP. Is is possible ?
HTML
<form name="myform" action="test_post.php" method="post">
Name: <input type='text' name='name' />
</form>
<form name="myform2" action="test_post.php" method="post">
Class: <input type='text' name='class' />
</form>
Search
JS
function submitform()
{
document.myform.submit();
document.myform2.submit();
}
PHP (test_post.php)
echo $name = $_POST['name'];
echo $class = $_POST['class'];
I tried with that code but it just show $_POST['class'] value. For name it show error : Undefined index: name in...
Please advice.
you dont need one form per input, you can have a million in one one form so ..
<form name="myform" action="test_post.php" method="post">
Name: <input type='text' name='name' />
Class: <input type='text' name='class' />
</form>
Search
should be fine, and you don't really need js to submit. a html submit input is better supported
<input id="submit" type="submit" value="submit">
You actually want two fields on one form - which you can then submit with no problems:
<form name="myform" action="test_post.php" method="post">
Name: <input type='text' name='name' />
Class: <input type='text' name='class' />
<input type='submit'>
</form>
Or you can submit it by using some JS anyhow if you do other thigns in the JS code.
if jquery is an option, then .deferred might be what you are looking for.
function submitform(){
//define a variable where we will store deferred objects
var def = true;
$("form").each(function() {
var postResult = $.Deferred();
//.when takes a deferred object as a param.
// if we don't pass a deferred object .when treats it as resolved.
// as our initial value of def=true, the first .when starts immediately
$.when(def).then(function(){
$.post('post_destination.php', form.serialize()).done(function(){
//the chain will fail after the first failed post request
//if you want all the requests to complete in any case change the above .done to .always
post.resolve();
});
});
// now we reassign def with the deferred object for the next post request
def = postResult;
});
}
and here's the link to when I asked the question some time ago. How to submit multiple jquery posts to a page one after another if database updates successfully?
Is there a way to get only a certain set of information from a form? Eg
<form>
<input name='I want this' value='one' type=text />
<input name='and this' value='one' type=text />
<input name='but not this' value='one' type=text />
</form>
Where, obviously, i only want the first two fields but not the third one? I've got a user inventory on my website that looks like this:
<form action="" method="POST">
<input name='item_id' value='1' type='hidden'>
<input type='button' name='slot1' value='1'>
<input type='button' name='slot2' value='2'>
<input name='item_id' value='2' type='hidden'>
<input type='button' name='slot1' value='1'>
<input type='button' name='slot2' value='2'>
</form>
I want the users to be able to select, item 1 and equip it to slot 1 but The only way i can think of doing this right now is to have them all be separate forms. and i feel like that would be bad coding.
Yes, using jquery, select only the first element and second elements value, post it using ajax, and retrieve and process data server side.
var i1 = $('form').eq(0).find('[name="item_id"]').val() //Values from first form only
var i2 = $('form').eq(0).find('[name="slot1"]').val()
$.ajax({
url: "test.php",
data: {i1:i1, i2:i2}, //Send this to php file.
}).done(function() {
$(this).addClass("done");
});
When you submit a form the values of all inputs associated with that form will be added to the $_POST (array) variable. You can always choose to ignore values when certain conditions apply. If that's not an option, I think you should opt for separate forms.
Another thing you could do—I do not understand the context of your problem, so I'm not sure if it applies to your situation—is have a user choose between "Item 1" and "Item 2" via radio buttons in your form. You can then base your form handling logic on the choice people made in the form.
I'm wondering how to resolve an issue where I have one text box and two buttons.
Each button needs the same data in the text box to accomplish its task.
One button is to update the existing record they are reviewing (with the new value in the text box), and the other button is used to add a new record (again, using the new value in the text).
One idea I had was to use jquery to update a hidden text box that gets updated when the visible text box is modified by the user.
So something like this: (this is just pseudocode...)
<form name="form1" method="post" action="controller1/method1">
<input type=text name=visibleTextBoxForForm1></input>
<button type=submit value=UPdate>
</form>
<form name="form2" method="post" action="controller2/method2">
<input type=hidden name=hiddenTextBoxforForm2></input>
<button type=submit value=New>
</form>
<script>
$('#visibleTextBoxForForm1').live('change', function() {
//update a hidden textbox in form2 with value of this textbox.
});
</script>
Is there a better way to do this?
Alternatively, you could do it via JQuery. Tie a clicklistener for each button and provide the correct URL to the form on click.
Here's some quick code... you'd have to correct the proper jquery queries for the correct elements.
<form name="form1" method="post">
<input type=text name=visibleTextBoxForForm1></input>
<button type=button value=Update>
<button type=button value=New>
</form>
<script>
$('update').click(function() {
$(form1).attr('action', <update url>).submit();
});
$('new').click(function() {
$(form1).attr('action', <new url>).submit();
});
</script>
If that's the only field, then simply have one form with two buttons and handle that text data based on the name of the button used to submit it.
<form name="form1" method="post" action="controller1/method1">
<input type="text" name="text" />
<input type="submit" name="insert" value="Insert New Data" />
<input type="submit" name="update" value="Update Existing Data" />
</form>
PHP (not CodeIgniter, since I'm not familiar with that framework):
if(isset($_POST['insert'])) {
// insert $_POST['text']
} else if (isset($_POST['update'])) {
// update $_POST['text']
} else {
// error
}