前端模板引擎,綁定數據

html

 <div id="resList"></div>

Template

<script id="Template" type="text/x-jquery-tmpl">
    <div>
        {{each Data}}
        <div class="col-md-4 pro_bor" >
            <div style="border:1px solid #f6f6f6; padding:5px; margin:10px 0px; height:300px;">
                <a href="/Supplier/Product/[email protected]&productId=${$value.Id}"><img src=${$value.Cover} height="150" width="100%" /></a>
                <div class="text-left col-md-12" style="margin:10px 0px;">${$value.Name}</div><div class="text-right col-md-12 am-text-danger">¥${$value.Shoujia}</div>
                <div class="text-left col-md-12">&nbsp;</div><div class="text-right col-md-12 am-text-danger" οnclick="deleteProduct(@ViewBag.UserId,${$value.Id})">刪除</div>
            </div>
        </div>
        {{/each}}
        <div class="col-md-12 am-input-group-sm "> <hr /></div>
    </div>
</script>

js

<script type="text/javascript">
    var pageSize=9;
    $(function () {
        getdata(1,pageSize);
    })

    function getdata(pageIndex, pageSize) {
        $.ajax({
            type: "get", //get
            async: true,  //(默認: true) 默認設置下,所有請求均爲異步請求。如果需要發送同步請求,請將此選項設置爲 false
            url: "/Supplier/Product/GetProductList",
            data: { "pageIndex": pageIndex, "pageSize": pageSize, "brandId": @ViewBag.BrandId }, //data: "name=John&location=Boston", 這樣寫也可以
            dataType: "json", //預期服務器返回的數據類型 text html script json jsonp xml
            beforeSend: function (XMLHttpRequest) {
                this; // 調用本次AJAX請求時傳遞的options參數
            },
            dataFilter: function (data, type) {
                // 對Ajax返回的原始數據進行預處理
                return data  // 返回處理後的數據
            },
            success: function (data, textStatus) {
                //data 可能是 xmlDoc, jsonObj, html, text, 等等...
                //this; // 調用本次AJAX請求時傳遞的options參數

                if (data.State == "logout") {
                    window.location.href = "/Account/Login";
                }
                if (data.State == "ok" && data.Data.length > 0) {

                    $("#resList").html("");
                    $("#Template").tmpl(data).appendTo("#resList");
                    $("#pagination_dif").html("");
                    $("#pagination_dif").html("").append(create_pagination(pageIndex, data.TotalPage));

                } else {

                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                // 通常 textStatus 和 errorThrown 之中
                // 只有一個會包含信息
                this; // 調用本次AJAX請求時傳遞的options參數
            },
            complete: function () {

            }
        });
    }




    function ajaxPage(pageIndex) {
        getdata(pageIndex, pageSize);
    }

    function deleteProduct(uid,pid){

        if(confirm("確定要刪除產品嗎?"))
        {
            var curPage=  $("li.active").find('a').text();
            $.ajax({
                type: "post", //get
                async: true,  //(默認: true) 默認設置下,所有請求均爲異步請求。如果需要發送同步請求,請將此選項設置爲 false
                url: "/Supplier/Product/ProductDelete",
                data: { "id": uid, "productId": pid,"curPage":curPage, "brandId": @ViewBag.BrandId,"pageSize":pageSize}, //data: "name=John&location=Boston", 這樣寫也可以
                dataType: "json", //預期服務器返回的數據類型 text html script json jsonp xml
                beforeSend: function (XMLHttpRequest) {
                    this; // 調用本次AJAX請求時傳遞的options參數
                },
                dataFilter: function (data, type) {
                    // 對Ajax返回的原始數據進行預處理
                    return data  // 返回處理後的數據
                },
                success: function (data, textStatus) {
                    //data 可能是 xmlDoc, jsonObj, html, text, 等等...
                    //this; // 調用本次AJAX請求時傳遞的options參數

                    if (data.State == "logout") {
                        window.location.href = "/Account/Login";
                    }
                    if (data.State == "ok") {

                        getdata(1,pageSize);

                    } else {
                        alert("刪除失敗");
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    // 通常 textStatus 和 errorThrown 之中
                    // 只有一個會包含信息
                    this; // 調用本次AJAX請求時傳遞的options參數
                },
                complete: function () {

                }
            });
        }

    }

</script>

cs

    /// <summary>
        /// 產品列表
        /// </summary>
        /// <param name="pageIndex"></param>
        /// <param name="pageSize"></param>
        /// <param name="brandId"></param>
        /// <returns></returns>
        [HttpGet]
        public JsonResult GetProductList(int pageIndex = 1, int pageSize = 9, int brandId = 0)
        {
            string state = "ok";

            int totalPage = 0;
            object query = null;


            string cookie_value = CookieHelper.GetSingleValueCookieValue("key");
            var obj = CacheManager.GetData<HzbModel.User>(cookie_value);

            if (obj == null)
            {
                state = "logout";
                goto Complete;
            }

            query = ProjectList_Pager(pageIndex, pageSize, out totalPage, obj.Id, "CreateTime", false, brandId).Select(m => new { Id = m.Id, Name = m.Name, Cover = m.Cover, Shoujia = m.ShouJia });

        Complete:
            var res = new JsonResult();
            res.Data = new { State = state, Data = query, TotalPage = totalPage };
            res.JsonRequestBehavior = JsonRequestBehavior.AllowGet;  //允許使用GET方式獲取,否則用GET獲取是會報錯。
            return res;

        }

        /// <summary>
        /// 分頁獲取數據
        /// </summary>
        /// <param name="pageIndex"></param>
        /// <param name="pageSize"></param>
        /// <param name="totalPage"></param>
        /// <param name="userId"></param>
        /// <param name="orderfield"></param>
        /// <param name="isDesc"></param>
        /// <param name="brandId"></param>
        /// <returns></returns>
        private List<Product> ProjectList_Pager(int pageIndex, int pageSize, out int totalPage, int userId, string orderfield, bool isDesc, int brandId)
        {
            Expression<Func<Product, bool>> where = PredicateExtensionses.False<Product>();
            where = where.Or(m => m.UserId == userId && m.BrandId == brandId && m.SoftDel == 0);


            int total;
            List<Product> list = IProductBll.GetListPage(pageIndex, pageSize, out total, where, orderfield, isDesc).ToList();

            totalPage = Convert.ToInt32(Math.Ceiling((double)total / pageSize));//總頁數

            return list;
        }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章