jquery ajax 后台和前台數據交互 C#


    <input type="button" id="updateInfo" value="更改貨載重量" />
    <div id="updateDiv" style="display:none;">
    <input type="hidden" value="@Model.ContainerCode" id="containercode"/>
       新毛重:<input type="text" id="nmz" />
       新重量:<input type="text" id="nzl" />
       新件數:<input type="text" id="njs" />
       <input type="button" id="submit" value="提交" />
    </div>

也是剛接觸不久,代碼中可能有一些不足之處,今天寫下,以后自己可能不需要去上網查找相關的東西。

  這個是VIEW中的代碼,

<script type="text/javascript">
    $(document).ready(function () {

        $("#updateInfo").click(function () {
            $("#nmz").attr("value","")
            $("#nzl").attr("value", "");
            $("#njs").attr("value", "");//調試的時候,刷新界面INPUT內的值會保留。所以這里需要清空INPUT
            $("#updateDiv").show();

        });

        $("#submit").click(function () {
            var containercode = $("#containercode").val();
            var nmz = $("#nmz").val();
            var nzl = $("#nzl").val();
            var njs = $("#njs").val();

            $.ajax({
                type: "POST",
                url: "/UnitLoads/updateHeight",
                data: {
                    containerCode: containercode,
                    mz: nmz,
                    zl: nzl,
                    js: njs
                },
                dataType: "JSON",
                success: function (result) {

                    if (result.toString() == "0") {
                        alert("未能成功!請檢查輸入!!");
                    }
                    else {
                        alert("更改成功!");
                        document.location.reload();//重新加載當前頁面
                    }

                }
            });

        });


    });
</script>


后台方法代碼如下:

      [HttpPost]
        public int updateHeight(string containerCode, string mz, string zl, string js)//對應AJAX中的DATA中的變量
        {
       
            if (string.IsNullOrEmpty(containerCode) || string.IsNullOrEmpty(mz) || string.IsNullOrEmpty(zl) || string.IsNullOrEmpty(js))
            {
                return 0;//返回給前台來判斷操作是否成功
            }
            CommandHelper.DoCommand(context =>
            {
                WmsRepositories repositories = new WmsRepositories(context);
                UnitLoad temp = repositories.UnitLoadRepository.GetCurrentUnitLoadByContainerCode(containerCode);
                temp.Meide.mz = Decimal.Parse(mz);

                foreach (var item in temp.Items)
                {
                    item.Meide.zl = Decimal.Parse(zl);
                    item.Meide.js = int.Parse(zl);
                }

            });
            return 1;
        }

 

以上的代碼主要的意義是讓自己知道前台怎么向后天傳遞多個數據,已經后台怎么向前台傳數據。當然現在向前台傳遞的數據比較簡單,就一個INT類型的。

下面的代碼是前台向前台傳遞多個數據,並且后天也向前台傳遞多個數據的代碼,

前台:

  $.ajax({
                type: "POST",
   
                url: "/NewOrder/getMaterialDetail",
                data: {
                    a: 1,
                    b: 2,
                    c: "cccc"
                },
                dataType: "JSON",
                success: function (result) {
          
                    alert(result.a);
                    alert(result.b);
                    alert(result.c);

                    $("#details").append(result);
                }
            });

 

后台:

        public class xxx
        {
            public int a { get; set; }
            public int b { get; set; }
            public string c { get; set; }
        }


        [HttpPost]
        public ActionResult getMaterialDetail(xxx x)
        {
            string json =  Newtonsoft.Json.JsonConvert.SerializeObject(x);
            return Content(json);
        }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM