如何在使用JQuery更新MySQL后填充DIV

时间:2022-10-29 00:09:16

I'm developing an AJAX project using jQuery. I'm thinking of creating a page that displays data from a table. On this page, I want to put a form to add another row to this table.

我正在使用jQuery开发一个AJAX项目。我正在考虑创建一个页面来显示来自表的数据。在这个页面上,我想要放置一个表单来向这个表添加另一行。

The problem is that I want to update the table on my page as soon as I have submitted the new data. Is that even possible? If so, how?

问题是,一旦我提交了新的数据,我就想要更新页面上的表。甚至可能吗?如果是这样,如何?

3 个解决方案

#1


2  

What you could do is bind an event to the submit button for the form.

您可以做的是将事件绑定到表单的submit按钮。

$('#formbutton').click(submit); 

Then load the values from the fields in the submit() function and then use $.ajax to submit the POST request and define a success call function to do a GET ajax request

然后从submit()函数的字段加载值,然后使用$。ajax提交POST请求并定义一个成功调用函数来执行GET ajax请求

function submit(){
  var field1 = $('#field1').val();
  var field2 = $('#field2').val();

  $.ajax({
    url: 'submitform.php',
    type: "POST",
    dataType: "text",
    data {field1: field1, field2, field2},
    success: function(data){
      getData();
    }

  });

}

function getData(){
  $.get("table.php",function(data){
    $('#table').html(data);
  });
}

#2


1  

You make the AJAX request to your script.

您将AJAX请求添加到脚本中。

Your script does its work and returns the new data.

脚本执行它的工作并返回新的数据。

Your AJAX query's success handler function updates the page with the received data.AJ

AJAX查询的success处理程序函数使用接收的data.AJ更新页面

Just look at the examples in the jquery documentation:

看看jquery文档中的示例:

http://api.jquery.com/jQuery.ajax/

http://api.jquery.com/jQuery.ajax/

#3


1  

Use jQuery ajax to send the form results to a PHP script, get the PHP to update/insert to the mysql db, then get the PHP to echo out the table data to the jQuery success callback, in which you take received data and place it in a div/table!

使用jQuery ajax将表单结果发送到PHP脚本,让PHP更新/插入到mysql db,然后让PHP将表数据回显到jQuery success回调,在该回调中接收到的数据并将其放入div/table中!

To get you started:

你开始:

http://blog.twostepmedia.co.uk/send-html-form-results-in-an-email-from-php-using-jquery-ajax/

http://blog.twostepmedia.co.uk/send-html-form-results-in-an-email-from-php-using-jquery-ajax/

#1


2  

What you could do is bind an event to the submit button for the form.

您可以做的是将事件绑定到表单的submit按钮。

$('#formbutton').click(submit); 

Then load the values from the fields in the submit() function and then use $.ajax to submit the POST request and define a success call function to do a GET ajax request

然后从submit()函数的字段加载值,然后使用$。ajax提交POST请求并定义一个成功调用函数来执行GET ajax请求

function submit(){
  var field1 = $('#field1').val();
  var field2 = $('#field2').val();

  $.ajax({
    url: 'submitform.php',
    type: "POST",
    dataType: "text",
    data {field1: field1, field2, field2},
    success: function(data){
      getData();
    }

  });

}

function getData(){
  $.get("table.php",function(data){
    $('#table').html(data);
  });
}

#2


1  

You make the AJAX request to your script.

您将AJAX请求添加到脚本中。

Your script does its work and returns the new data.

脚本执行它的工作并返回新的数据。

Your AJAX query's success handler function updates the page with the received data.AJ

AJAX查询的success处理程序函数使用接收的data.AJ更新页面

Just look at the examples in the jquery documentation:

看看jquery文档中的示例:

http://api.jquery.com/jQuery.ajax/

http://api.jquery.com/jQuery.ajax/

#3


1  

Use jQuery ajax to send the form results to a PHP script, get the PHP to update/insert to the mysql db, then get the PHP to echo out the table data to the jQuery success callback, in which you take received data and place it in a div/table!

使用jQuery ajax将表单结果发送到PHP脚本,让PHP更新/插入到mysql db,然后让PHP将表数据回显到jQuery success回调,在该回调中接收到的数据并将其放入div/table中!

To get you started:

你开始:

http://blog.twostepmedia.co.uk/send-html-form-results-in-an-email-from-php-using-jquery-ajax/

http://blog.twostepmedia.co.uk/send-html-form-results-in-an-email-from-php-using-jquery-ajax/