Question

我必须在不提交的情况下从数据库（使用外部php文件）更新表单的某些元素。

例如：写入员工ID，在提交之前将填充名称。我对ajax很陌生，因此没有找到如何执行相同的操作。

我的代码的部分内容如下：

xyz.js的一部分

$("#makeproj-nav").click(function()
{

// project form starts

s = "<form id = 'create_new_form' name = 'new_form' method='post' action='insert_new.php'><div class='project_form'><span>";

s += "<div class='Form_contents'> Employee ID: <input type='text' size='100' name='emp_id'></div>";

s += "<div class='Form_contents'> Employee Name: <input type='text' size='100' name='emp_name'></div>";

s += "<div class='Form_contents'> <input type='submit'> </div>";
s += "<span></div></form>";

$("#card-wrapper").html(s);

$('#create_new_form').on('click', function(e) {

$.ajax({
      url : 'Find_EmpName.php',
      type : 'POST',
      data : $(this).serialize(),
      success : function(response) {
        $("emp_name").value(response.reply);
      }
    });
  });

});

Find_EmpName.php理想情况下应该获取员工ID，然后应返回员工姓名并在所需字段中更新。如果你纠正上面的代码会很棒。感谢

Answer 1

首先，

你.submit()表单，你不要.click()它。

您点击表单中的提交按钮提交表单，但您不需要点击表格。

首先将click更改为submit，除非您希望每次有人点击您的表单时执行您的ajax调用。

然后，使用.preventDefault()禁用提交事件的正常提交行为，并在有人点击submit按钮或提交表单后进行ajax调用。

$('#create_new_form').on('submit', function(event){
    event.preventDefault();
    //your ajax call
});

接着，

执行此操作时：

$("emp_name").value(response.reply);

具体来说，这个：

$("emp_name")

您要求jQuery选择<emp_name>

的所有元素

有这样的事吗？我没想到。

那么，你想要做的是按名称定位输入，对吗？

所以你这样做：

$("input[name=emp_name]")

接着，

jQuery中没有.value()，它是.val()。不要混用javascript和jQuery。

正确的版本是：

$("#create_new_form input[name=emp_name]").val(response.reply);

您可以在此处找到有关如何使用选择器的更多信息：

http://api.jquery.com/category/selectors/

祝你好运。

更新表单元素而不提交（Ajax + JS）

1 个答案:

首先，

接着，

接着，