Question

我遇到了将表单数据保存到数据库中的问题。我完成了下面显示的小代码，当我在表单中输入数据并单击我的提交按钮时它不起作用。

＆＃13;

$(".btn").click(function(e) {
	e.preventDefault();

	var form = $("#frm");

	$.ajax({
		url: '/Form/Index',
		data: form.serialize(),
		type: 'POST',
		success: function(data) {
        }
	});
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form role="form" id="frm">
    <div class="form-group">
        <div class="col-sm-6 col-lg-12 col-md-12">
            <div class="form-group">
                <label for="name" style="color:black;">Product Name</label>
                <input type="text" class="form-control" id="name"
                        placeholder="Product Name" style="color:black;">
            </div>
            <div class="form-group">
                <label for="name" style="color:black;">Product Date</label>
                <input type="text" class="form-control" id="Text1"
                    placeholder="Date" style="color:black;">
            </div>
            <div class="form-group">
                <label for="name" style="color:black;">Product Price</label>
                <input type="text" class="form-control" id="Text2"
                    placeholder="Date" style="color:black;">
            </div>
        </div>
    </div>
    
    <button type="submit" class="btn btn-default" id="ok" >Submit</button>
</form>

＆＃13;

以上是我的代码，请给我解决方案

Answer 1

当我检查你的代码时，客户端代码工作正常，我在这种情况下可以想象的唯一问题是你android:padding="@dimen/activity_padding"。

确保您提供的内容正确url path。
您应该检查是否有关于该页面的信息。

Answer 2

您正在使用哪种框架。不同的框架具有不同的语法来传递URL中的值。在URL参数中检查页面源页面视图中的路径，或者在提交后检查控制台日志中的错误。可能无法获得正确的行动路径。

Answer 3

从按钮

中删除type =“submit”

您必须使用id获取表单提交并序列化表单数据 `

$("#formid").submit(function(e) {
var url = "urlpathtohandlerequest"; 

$.ajax({
       type: "POST",
       url: url,
       data: $("#formid").serialize(), 
       success: function(response)
       {
           alert(response); 
       }
     });

e.preventDefault(); // stops default submit.
});

`

Answer 4

确保ajax库已成功加载，并尝试将警报消息转到您到达的前进步骤，进行此测试：

$(".btn").click(function(e) {
    e.preventDefault();

    var form = $("#frm");

    $.ajax({
        url: '/Form/Index',
        data: form.serialize(),
        type: 'POST',
        success: function(data) {
        },
        beforeSend: function() {
             alert('before send alert')
        },
        error: function (request, status, error) {
             alert(error);
        },
    });
});

如果beforeSend没有执行，那么你的问题与ajax库有关。

Answer 5

使用它：

$("#ok").click(function(e) {
 // your code 
}

请参阅javascript中的id而不是class属性。如果您引用类属性而不是一次点击javascript就会对该类执行preventDefault，这样如果不刷新页面，该按钮就不起作用。

将preventDefault函数放在函数的最后。

如何在MVC中使用Ajax提交表单

5 个答案: