I add <input type="text"> via $('#').click(function(){}); Then use form.js to write into the table, but does not.
If the text is standalone it does write.
below is the code used to ajax form.js.
$(function() {
$("#c .button").click(function() {
var text = $("#N").val();
var dataString = 'N='+ N;
$.ajax({
type: "POST",
url: "s.php",
data: dataString,
success: function(){
$('.success').fadeIn(1000);
}
});
return false; });
});
Should I use .live or .on. Neither of which works though. Any ideas as to why it does not work.
[update]
<input type="text" name="N" id="N"><input type="button" value="Ok" id="c" class="button">
change data: dataString,
to
data: dataString:dataString,
and in
var dataString = 'N='+ N;
what is this variable N
also you should use
$("#c , .button").click(function()
instead of
$("#c .button").click(function()
Related
How can I send input values through AJAX on button click? My code is below. Thanks in advance.
while
{
<form class="commentform">
<input type="hidden" class="proid" name="proid" value="<?=$rr['id']?>">
<input type="text" class="form-control" name="comval" placeholder="Write a comment.." autocomplete="off">
<button class="btn btn-post" type="button">Post</button>
</div>
</form>
}
$(document).ready(function() {
$(document).on('click', '.btn-post', function(){
var thePostID = $(this).val;
$.ajax({
url: 'fetch_comments.php',
data: { postID: thePostID },
type: 'POST',
success: function() {
alert(data);
}
});
Firstly, the correct method is $(this).val(), not just $(this).val.
Secondly, you can simplify your code by getting the data from the closest form element using serialize(). Try this:
$(document).on('click', '.btn-post', function() {
var $form = $(this).closest('form');
$.ajax({
url: 'fetch_comments.php',
data: $form.serialize(),
type: 'POST',
success: function() {
alert(data);
}
});
});
$("form").serialize();
Serialize a form to a query string, that could be sent to a server in an Ajax request.
So far, i have done creating report with paging.
sample code index.php:
<div class='web'>
<h1>Data Order Notaris</h1>
<div id="page_data"></div>
<span class="flash"></span>
</div>
and use script:
$(document).ready(function(){
change_page('0');
});
function change_page(page_id){
$(".flash").show();
$(".flash").fadeIn(400).html('Loading <img src="ajax-loader.gif" />');
var dataString = 'page_id='+ page_id;
$.ajax({
type: "POST",
url: "paging.php",
data: dataString,
cache: false,
success: function(result){
$(".flash").hide();
$("#page_data").html(result);
}
});
}
my file for show paging is paging.php
my problem when using live search. i am trying add input type in index.php
add input script:
<input type='text' name='search' placeholder='search' />
i think it doesn't need form and submit button.
how to post value from input name='search' to paging.php for filter data report?
is it need more function or using function change_page? i am still confuse with logic. thanks for help
You should give Input in this way:
<input type='text' Id="search_box" name='search' placeholder='search' />
Then using js you can fetch this field's value
So your js code will be as:
$(document).ready(function(){
change_page('0');
});
function change_page(page_id){
//To get the field value
var search_val = $("#search_box").val();
$(".flash").show();
$(".flash").fadeIn(400).html('Loading <img src="ajax-loader.gif" />');
var dataString = 'page_id='+ page_id+'&search='+search_val;
$.ajax({
type: "POST",
url: "paging.php",
data: dataString,
cache: false,
success: function(result){
$(".flash").hide();
$("#page_data").html(result);
}
});
}
Then make the appropriate query in your paging.php :)
I'm trying to use the POST method in jQuery to make a data request. So this is the code in the html page:
<form>
Title : <input type="text" size="40" name="title"/>
<input type="button" onclick="headingSearch(this.form)" value="Submit"/><br /><br />
</form>
<script type="text/javascript">
function headingSearch(f)
{
var title=f.title.value;
$.ajax({
type: "POST",
url: "edit.php",
data: {title:title} ,
success: function(data) {
$('.center').html(data);
}
});
}
</script>
And this is the php code on the server :
<?php
$title = $_POST['title'];
if($title != "")
{
echo $title;
}
?>
The POST request is not made at all and I have no idea why. The files are in the same folder in the wamp www folder so at least the url isn't wrong.
You need to use data: {title: title} to POST it correctly.
In the PHP code you need to echo the value instead of returning it.
Check whether title has any value or not. If not, then retrive the value using Id.
<form>
Title : <input type="text" id="title" size="40" name="title" value = ''/>
<input type="button" onclick="headingSearch(this.form)" value="Submit"/><br /><br />
</form>
<script type="text/javascript">
function headingSearch(f)
{
var title=jQuery('#title').val();
$.ajax({
type: "POST",
url: "edit.php",
data: {title:title} ,
success: function(data) {
$('.center').html(data);
}
});
}
</script>
Try this code.
In php code, use echo instead of return. Only then, javascript data will have its value.
try this
$(document).on("submit", "#form-data", function(e){
e.preventDefault()
$.ajax({
url: "edit.php",
method: "POST",
data: new FormData(this),
contentType: false,
processData: false,
success: function(data){
$('.center').html(data);
}
})
})
in the form the button needs to be type="submit"
Id advice you to use a bit simplier method -
$.post('edit.php', {title: $('input[name="title"]').val() }, function(resp){
alert(resp);
});
try this one, I just feels its syntax is simplier than the $.ajax's one...
function signIn()
{
var Username = document.getElementById("Username").value;
var Password = document.getElementById("Password").value;
$.ajax({
type: 'POST',
url: "auth_loginCode.jsp",
data: {Username: Username, Password: Password},
success: function (data) {
alert(data.trim());
window.location.reload();
}
});
}
contentType: 'application/x-www-form-urlencoded'
I have two pages in php and I need that the value of radioButton selection pass to another page, but it not work.
The jquery code of the page that send the data is:
$(document).ready(function(){
$("#continue").click(function(){
var val = $("input[#name='opt']:checked").val();
$.ajax({
type: 'GET',
url:'editor.php',
data:'radio=' + val,
dataTyoe:'html',
succes: alert(val)
});
});
});
The html code into the php page is:
<input type="radio" id="opt" name="opt" value="opt1" checked="checked">Opt 1<br/>
<input type="radio" id="opt" name="opt" value="opt2"/>opt2<br />
<input type="radio" id="opt" name="opt" value="opt3"/>opt3<br />
Guardar continuar<br/>
And the code of the page that recive data is the follow.
<?php
$valor = $_REQUEST['radio'];
echo $valor
?>
Thanks
There were some spelling mistakes and need some correction. Try the following code;
$(document).ready(function(){
$("#continue").click(function(){
var val1 = $("input[name='opt']:checked").val();
$.ajax({
type: 'GET',
url:'editor.php',
data:'radio=' + val1,
success: function(){
alert(val1);
}
});
});
});
you misspelled succes: it should be success:
You may have some errors : try replacing dataTyoe:'html' for dataType:'html', Also $("input[#name='opt']:checked") by $("input[#name=opt]:checked")... and the success callback too...
It would look like :
var val = $("input[#name=opt]:checked").val();
$.ajax({
type: "GET",
url: "editor.php",
data:'radio='+val,
dataType: "html",
async:false,
success: function(){
alert(val);
}
}
);
Also you could remove the link from the html :
Guardar continuar<br/>
Actually i want to send the value of checkbox when it is checked through jquery...means when i click on checkbox it has to send automatically...i tried with following code..
$(document).ready(function () {
$(".checkBox").change(function () {
var s = $(this).val();
var dataString = 's=' + s;
$.ajax({
type: "GET",
url: "xyz.php",
data: dataString,
cache: false,
success: function (html) {}
});
});
});
and html code is
<div class = "checkBox">
<input type = "checkbox" name = "select[]" value = <?php $friendUid?> />
</div>
I was unable to send to other page
Change your html: Put the class = "checkBox" onto the checkbox element
<div>
<input type = "checkbox" name = "select[]" value = <?php $friendUid?> class = "checkBox"/>
</div>
The selector $(".checkBox") will attach that function to any items with the class of checkBox, and since your checkbox does not have that as its class, you are actually attaching your function to the div that contains the checkbox instead, which of course will never trigger your function.
<?php $friendUid?> should be <?php echo $friendUid ?>
with $(".checkbox") you're referencing something of class 'checkbox' (i.e., your div, not the actual checkbox).
Add the class to the <input type='checkbox'> instead
try this in your code and let us know what happens.
<script type="text/javascript">
alert('check0');
$(document).ready(function () {
alert('check1');
$(".checkBox").change(function () {
alert('check2');
var s = $(this).val();
var dataString = 's=' + s;
$.ajax({
type: "GET",
url: "test.php",
data: dataString,
cache: false,
success: function (html) {
alert('check3');
}
});
});
});
</script>
<input type="checkbox" class="checkBox" />