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

Question

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

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

	var form = $("#frm");

	$.ajax({
		url: '/Form/Index',
		data: form.serialize(),
		type: 'POST',
		success: function(data) {
        }
	});
});

<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>

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

Answer 1

我检查过你的代码，客户端代码工作正常，在这种情况下我能想到的唯一问题是你的 url path。

• 确保您提供正确的 url 路径。

• 您应该检查它是否点击了那个页面。