两件事 Jquery.form 锁

• 表单提交跳转
• 如何解决同时调用相同接口产生的数据错误

两个问题

第一个解决了，用jQuery.form 这个插件

HTML 部分的代码

   <form id="projectInfo" action="/Home/Add" method="post" enctype="multipart/form-data">
                                <div class="form-group row">
                                    <label for="projectImage" class="col-sm-2 col-form-label">项目图片</label>
                                    <div class="col-sm-10">
                                        <input type="file" name="projectImage" class="form-control-file" id="projectImage" />
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="projectName" class="col-sm-2 col-form-label">项目名</label>
                                    <div class="col-sm-10">
                                        <input type="text" name="projectName" class="form-control" id="projectName" required />
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="projectDate" class="col-sm-2 col-form-label">项目时间</label>
                                    <div class="col-sm-10">
                                        <input type="date" name="projectDate" class="form-control" id="projectDate" required />
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="projectContent" class="col-sm-2 col-form-label">项目内容</label>
                                    <div class="col-sm-10">
                                        <textarea id="projectContext" name="projectContext"></textarea>
                                    </div>
                                </div>
                                <button type="submit" class="btn btn-primary">添加</button>

                            </form>
                            <div id="output1">替换文本</div>

js部分代码

        $(document).ready(function () {
           var options = {
                target: '#output1',   // target element(s) to be updated with server response
                beforeSubmit: showRequest,  // pre-submit callback
                success: showResponse  // post-submit callback

                // other available options:
                //url:       url         // override for form's 'action' attribute
                //type:      type        // 'get' or 'post', override for form's 'method' attribute
                //dataType:  null        // 'xml', 'script', or 'json' (expected server response type)
                //clearForm: true        // clear all form fields after successful submit
                //resetForm: true        // reset the form after successful submit

                // $.ajax options can be used here too, for example:
                //timeout:   3000
            };

            // bind form using 'ajaxForm'
            $('#projectInfo').ajaxForm(options);

        });

        function showRequest(formData, jqForm, options) {
            // 提交前
            var queryString = $.param(formData);

            // jqForm is a jQuery object encapsulating the form element.  To access the
            // DOM element for the form do this:
            // var formElement = jqForm[0];

            console.log(queryString)

            // here we could return false to prevent the form from being submitted;
            // returning anything other than false will allow the form submit to continue
            return true;
        }

        // post-submit callback
        function showResponse(responseText, statusText, xhr, $form) {
            // 提交后
            console.log(statusText)
            console.log(responseText)

          
        }

后台代码

        public string Add()
        {
            HttpPostedFileBase projectImage = Request.Files[0];
            string projectName = Request.Form["projectName"];
            string projectDate = Request.Form["projectDate"];
            string projectContext = Request.Form["projectContext"];

            return "返回内容";

        }

第二个问题，是在测试中发现有一个接口多次调用的话会发生多次执行一条SQL语句的风险，对数据产生不好的影响

暂时的解决方法就是在执行前做了一个判断，改变过就不允许执行了，这样多次调用这个接口的时候就会有这个判断，判断后就如果有数据就不允许执行了