Form Inside of $.Load Not Posting Correctly

Form inside of $.load not posting correctly

Are you familiar with AJAX? Forgive me if you know this already, but in case you don't:

Ajax posts data to an external php file, which processes the data it receives, and sends back an answer. It looks like this:

FILE #1:

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#Sel').change(function() {
var opt = $(this).val();
var someelse = 'Hello';
var more_stuff = 'Goodbye';
$.ajax({
type: "POST",
url: "receiving_file.php",
data: 'selected_opt=' + opt + '&something_else=' +someelse+'&more_stuff='+more_stuff,
success:function(data){
alert('This was sent back: ' + data);
}
});
});
});
</script>
</head>
<body>

<select id = "Sel">
<option value ="Song1">default value</option>
<option value ="Song2">Break on through</option>
<option value ="Song3">Time</option>
<option value ="Song4">Money</option>
<option value="Song5">Saucerful of Secrets</option>
</select>

FILE #2: receiving_file.php

<?php
$recd = $_POST['selected_opt'];
echo 'You chose: ' . $recd;

Jquery form not working when inside a div

Try this code:

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript" ></script>
<script type="text/javascript">
$(document).ready(function() {

$("#DataToDB").submit(function() {
var User = $('#User').attr('value');
var Message = $('#Message').attr('value');
$.ajax({
type: "POST",
url: "updateDB.php",
data: "User="+ escape(User) +"& Message="+ escape(Message),
dataType: "html",
scriptCharset: "utf-8",
success: function() {
alert("Message sent");
}
});
$("#Message").attr("value", "");
$('input#Message').focus();
return false;
});

});
</script>
</head>

<body>

<div id="menu">
<a href="Page1.php" class="linkpage">Page1</a>
<a href="Page2.php" class="linkpage">Page2</a>
</div>

<div id="main">
<form id="DataToDB" name="DataToDB">
<input type="hidden" name="User" id="User">
<input type="text" name="Message" id="Message">
<input type="submit" name="Send" value="Send">
</form>
</div>

</body>

Ahhh... simple. Insert this in your Page1.php Page2.php

<form id="DataToDB" name="DataToDB">
<input type="hidden" name="User" id="User">
<input type="text" name="Message" id="Message">
<input type="submit" name="Send" value="Send">
</form>

<script type="text/javascript">

$("#DataToDB").submit(function() {
var User = $('#User').attr('value');
var Message = $('#Message').attr('value');

$.ajax({
type: "POST",
url: "updateDB.php",
data: "User="+ escape(User) +"& Message="+ escape(Message),
dataType: "html",
scriptCharset: "utf-8",
success: function() {
alert("Message sent");
}
});
$("#Message").attr("value", "");
$('input#Message').focus();
return false;
});

</script>

Form won't display correctly

Firstly, Re-add this to MainForm.cs:

public MainForm()
{
InitializeComponent();
}

Then, go to Build > Clean and then Build > Rebuild

Everytime in the constructor of the form make sure InitializeComponent() method is there.

This method initializes your components i.e. controls in your form (hence the name InitializeComponent) so that memory are allotted to them (and event handlers are added to them if you have added them).

Post inside controller not loading into model in Yii2

Finally I find the solution

<?php
$form = ActiveForm::begin(
[
'action' => 'start',
]
);
?>
<div class="form-group">
<input type="text" name="username" placeholder="FullName">
<?= Html::a('submit', Url::to(['start', 'link' => $model->link]), ['data-method' => 'POST']) ?>
</div>

<?php ActiveForm::end();?>

thank you for all

What is the proper way to submit a form with JS and still post all form data successfully?

The reason for the form not submitting because you are submitting the whole form without the submit button which is
<button type="submit" class="btn btn-primary" name="ws-add-to-cart">Add to Cart</button>
which you have declared in php to get a post request like this

if (isset($_POST['ws-add-to-cart'])) {...

When you call submit(); on the form via the get method, you see
'/new-quote/?quote_number=1546751962211&custom_price=222.22'

but where's ws-add-to-cart, it's not submitting and that's the reason why php isn't getting your request


The fix will be to add .click() on the submit button instead of submitting the form

<script>
function enterVals($val){
var price = $val.price;
document.getElementById("quote_number").value = $val.num
document.getElementById("custom_price").value = $val.price
document.getElementsByName("ws-add-to-cart").click();
}
</script>

Or in your script in case you want to use jquery, this is the fix

<script>    
jQuery('#newQuoteApp').load(function() {
var iFrameDOM = jQuery("iframe#newQuoteApp").contents();
jQuery('#newQuoteApp').contents().find('#newQuoteForm').submit(function() {
jQuery("input#custom_price").val(jQuery('#newQuoteApp').contents().find('#cust_price').text()); // updated
jQuery("input#quote_number").val(jQuery('#newQuoteApp').contents().find('#quot_num').text());

jQuery("button[name=ws-add-to-cart]").click();
return true; //return false prevents submit
});
});
</script>

This is definitely the answer and sorry for my stupidity, i didn't pay required attention before

Submit button doesn't work

If you are not using any JavaScript for form validation then a simple layout for your form would look like this:

<form action="formHandler.php" method="post">    
<input name="fname" id="fname" type="text" value="example" />
<input type="submit" value="submit" />
</form>

You need to ensure you have the submit button within the form element and an appropriate action attribute on the form element is present.

For a more direct answer, provide the code you are working with.

You may find the following of use: http://www.w3.org/TR/html401/interact/forms.html



Related Topics



Leave a reply



Submit