按钮单击不会触发 JQuery 函数

Question

我的控制器有 actionresult:-

    [HttpPost]
    [LogInFilter]
    public JsonResult MemberCreate(GarhwalBhawan.Models.MemberTbl Mem) // Record Insert  
    {
        if (ModelState.IsValid)
        {
            db.MemberTbls.Add(Mem);
            db.SaveChanges();
            return Json(Mem, JsonRequestBehavior.AllowGet);
        }
        return Json(Mem, JsonRequestBehavior.AllowGet);
    }    

    [HttpGet]
    [LogInFilter]
    public PartialViewResult MemberCreate()   //Insert PartialView  
    {
        return PartialView(new GarhwalBhawan.Models.MemberTbl());
    }

在我的视图中，我创建了一个表单，单击按钮时，我将 json 函数调用为：-

 <fieldset>
        <legend></legend>

        <div class="editor-label">
            Member Name
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Name)
            @Html.ValidationMessageFor(model => model.Name)
        </div>

        <div class="editor-label">
            Member Post
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Post)
            @Html.ValidationMessageFor(model => model.Post)
        </div>

        <div class="editor-label">
            Member Phone
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Phone)
            @Html.ValidationMessageFor(model => model.Phone)
        </div>

        <p>
            <input id="memberSave" type="button" value="Create"  />
        </p>
    </fieldset>
}

MemberSave as 的脚本函数：-

@section Scripts {

<script type="text/javascript">

   $(document).ready(function() {
  $("#memberSave").click(function()  {
        var Name = $("#Name").val();
        var Post = $("#Post").val();
        var Phone = $("#Phone").val();

        var Member = {
            "Name": Name, "Post": Post,
            "Phone": Phone
        });

        $.post("/Admin/MemberCreate", Member,
        function (data) { if (data == 0) { location = location.href; } }, 'json');
    });
</script>
}

问题是点击创建按钮时它没有触发任何 JQuery 的点击事件。

请帮忙。

Answer 1

好吧，你把它标记为 jquery，那么为什么不使用 jquery 来附加处理程序呢？

<input type="button" id="member_save" value="Create"  />

<script>


$(document).ready(function(){ 
    $('#member_save').on('click', function(){ 
       //your code here
     });

});

</script>

Answer 2

您可以通过这种方式将id添加到按钮并单击该id的事件。

$(document).ready(function() {
      $("#myButton").click(function() {
        alert("button clicked.");
        //do ajax post here
      });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="myButton" type="button" value="Create" />

Answer 3

请正确关闭括号..

    @section Scripts {

    <script type="text/javascript">

       $(document).ready(function() {
      $("#myButton").click(function()  {
            var Name = $("#Name").val();
            var Post = $("#Post").val();
            var Phone = $("#Phone").val();

            var Member = {
                "Name": Name, "Post": Post,
                "Phone": Phone
            };)};

            $.post("/Admin/MemberCreate", Member,
            function (data) { if (data == 0) { location = location.href; } }, 'json');
});
</script>
    }