JqG​​rid向DB添加新行

时间:2017-10-14 23:17:50

标签: c# jquery sql asp.net-mvc jqgrid

我已经在我的Asp.net MVC项目上设置了一个JQGrid,除了在我的SQL DB中添加一个新行之外,一切都正常工作。它成功地向jQGrid添加了一行,但是没有在DB中创建新条目。我在"创建"中设置了一个断点。动作方法,它被调用。值得注意的是" Edits"现有条目的工作完美无瑕。我已经有一段时间了。啤酒是最佳答案。

控制器:

 public class SettingsController : Controller
{
    // GET: Settings
    public ActionResult Index()
    {
        return View();
    }

    // GET: Users
    public ActionResult Users()
    {

        return View();
    }
    SmartAdminMvcEntities db = new SmartAdminMvcEntities();
    public JsonResult GetValues(string sidx, string sord, int page, int rows) //Gets the todo Lists.  
    {
        //System.Diagnostics.Debug.WriteLine("GetValues");
        //Debug.WriteLine("GetValues");
        Trace.Write("Error Message");

        int pageIndex = Convert.ToInt32(page) - 1;
        int pageSize = rows;
        var Results = db.AspNetUsers.Select(
            a => new
            {
                a.Id,
                a.UserName,
                a.Email,
                a.LockoutEnabled,
                a.AccessFailedCount,
            });
        int totalRecords = Results.Count();
        var totalPages = (int)Math.Ceiling((float)totalRecords / (float)rows);
        if (sord.ToUpper() == "DESC")
        {
            Results = Results.OrderByDescending(s => s.Id);
            Results = Results.Skip(pageIndex * pageSize).Take(pageSize);
        }
        else
        {
            Results = Results.OrderBy(s => s.Id);
            Results = Results.Skip(pageIndex * pageSize).Take(pageSize);
        }
        var jsonData = new
        {
            total = totalPages,
            page,
            records = totalRecords,
            rows = Results
        };
        return Json(jsonData, JsonRequestBehavior.AllowGet);

    }

    // TODO:insert a new row to the grid logic here  
    [HttpPost]
    public string Create([Bind(Exclude = "Id")] AspNetUser obj)
    {
        //System.Diagnostics.Debug.WriteLine("Create");
        string msg;
        try
        {
            if (ModelState.IsValid)
            {
                db.AspNetUsers.Add(obj);
                db.SaveChanges();
                msg = "Saved Successfully";
            }
            else
            {
                msg = "Validation data not successfull";
            }
        }
        catch (Exception ex)
        {
            msg = "Error occured:" + ex.Message;
        }
        return msg;
    }
    public string Edit(AspNetUser obj)
    {
        System.Diagnostics.Debug.WriteLine("Edit");
        string msg;
        try
        {
            if (ModelState.IsValid)
            {
                db.Entry(obj).State = EntityState.Modified;
                db.SaveChanges();
                msg = "Edit Successfully";
            }
            else
            {
                msg = "Validation data Edit not successfull";
            }
        }
        catch (Exception ex)
        {
            msg = "Error occured Editing:" + ex.Message;
        }
        return msg;
    }
    public string Delete(int Id)
    {
        AspNetUser list = db.AspNetUsers.Find(Id);
        db.AspNetUsers.Remove(list);
        db.SaveChanges();
        return "Deleted successfully";
    }

}

查看:

    </div>
    <!-- end row -->

    <!-- widget grid -->
    <section id="widget-grid" class="">

        <!-- row -->
        <div class="row">

            <!-- NEW WIDGET START -->
            <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">

                <table id="jqgrid"></table>
                <div id="pjqgrid"></div>


            </article>
            <!-- WIDGET END -->

        </div>

        <!-- end row -->

    </section>
    <!-- end widget grid -->

</div>
<!-- END MAIN CONTENT -->
@section pagespecific {
<script type="text/javascript">
    $(document).ready(function () {
        pageSetUp();

        jQuery("#jqgrid").jqGrid({
            url: "/Settings/GetValues",
            datatype: "json",
            mtype: 'GET',
            height: 'auto',
            colNames: ['Id', 'UserName', 'Email', 'LockoutEnabled', 'AccessFailedCount'],
            colModel: [
          {
              key: true,
              hidden: true,
              name: 'Id',
              index: 'Id',
              editable: true
          }, {
              key: false,
              name: 'UserName',
              index: 'UserName',
              editable: true
          }, {
              key: false,
              name: 'Email',
              index: 'Email',
              editable: true
          }, {
              key: false,
              name: 'LockoutEnabled',
              index: 'LockoutEnabled',
              editable: true
          }, {
              key: false,
              name: 'AccessFailedCount',
              index: 'AccessFailedCount',
              editable: true
          }],
            rowNum: 10,
            rowList: [10, 20, 30],
            pager: '#pjqgrid',
            sortname: 'id',
            toolbarfilter: true,
            viewrecords: true,
            sortorder: "asc",
            gridComplete: function () {
                var ids = jQuery("#jqgrid").jqGrid('getDataIDs');
                for (var i = 0; i < ids.length; i++) {
                    var cl = ids[i];
                    be = "<button class='btn btn-xs btn-default' data-original-title='Edit Row' onclick=\"jQuery('#jqgrid').editRow('" + cl + "');\"><i class='fa fa-pencil'></i></button>";
                    se = "<button class='btn btn-xs btn-default' data-original-title='Save Row' onclick=\"jQuery('#jqgrid').saveRow('" + cl + "');\"><i class='fa fa-save'></i></button>";
                    ca = "<button class='btn btn-xs btn-default' data-original-title='Cancel' onclick=\"jQuery('#jqgrid').restoreRow('" + cl + "');\"><i class='fa fa-times'></i></button>";
                    //ce = "<button class='btn btn-xs btn-default' onclick=\"jQuery('#jqgrid').restoreRow('"+cl+"');\"><i class='fa fa-times'></i></button>";
                    //jQuery("#jqgrid").jqGrid('setRowData',ids[i],{act:be+se+ce});
                    jQuery("#jqgrid").jqGrid('setRowData', ids[i], {
                        act: be + se + ca
                    });
                }
            },
            editurl: '/Settings/Edit',
            caption: "Users that have access to the site:",
            multiselect: true,
            autowidth: true
        });


        //  "/Settings/Create" is being called in the controller. I put in a 
        //    break to test it. 
        jQuery("#jqgrid").jqGrid("navGrid", "#pjqgrid", {/*navGrid options*/ },
   {/*navGrid Edit*/ }, { url: '/Settings/Create' }, { url: '/Settings/Delete' });




        jQuery("#jqgrid").jqGrid('inlineNav', "#pjqgrid");
        /* Add tooltips */
        $('.navtable .ui-pg-button').tooltip({
            container: 'body'
        });

        // remove classes
        $(".ui-jqgrid").removeClass("ui-widget ui-widget-content");
        $(".ui-jqgrid-view").children().removeClass("ui-widget-header ui-state-default");
        $(".ui-jqgrid-labels, .ui-search-toolbar").children().removeClass("ui-state-default ui-th-column ui-th-ltr");
        $(".ui-jqgrid-pager").removeClass("ui-state-default");
        $(".ui-jqgrid").removeClass("ui-widget-content");

        // add classes
        $(".ui-jqgrid-htable").addClass("table table-bordered table-hover");
        $(".ui-jqgrid-btable").addClass("table table-bordered table-striped");

        $(".ui-pg-div").removeClass().addClass("btn btn-sm btn-primary");
        $(".ui-icon.ui-icon-plus").removeClass().addClass("fa fa-plus");
        $(".ui-icon.ui-icon-pencil").removeClass().addClass("fa fa-pencil");
        $(".ui-icon.ui-icon-trash").removeClass().addClass("fa fa-trash-o");
        $(".ui-icon.ui-icon-search").removeClass().addClass("fa fa-search");
        $(".ui-icon.ui-icon-refresh").removeClass().addClass("fa fa-refresh");
        $(".ui-icon.ui-icon-disk").removeClass().addClass("fa fa-save").parent(".btn-primary").removeClass("btn-primary").addClass("btn-success");
        $(".ui-icon.ui-icon-cancel").removeClass().addClass("fa fa-times").parent(".btn-primary").removeClass("btn-primary").addClass("btn-danger");

        $(".ui-icon.ui-icon-seek-prev").wrap("<div class='btn btn-sm btn-default'></div>");
        $(".ui-icon.ui-icon-seek-prev").removeClass().addClass("fa fa-backward");

        $(".ui-icon.ui-icon-seek-first").wrap("<div class='btn btn-sm btn-default'></div>");
        $(".ui-icon.ui-icon-seek-first").removeClass().addClass("fa fa-fast-backward");

        $(".ui-icon.ui-icon-seek-next").wrap("<div class='btn btn-sm btn-default'></div>");
        $(".ui-icon.ui-icon-seek-next").removeClass().addClass("fa fa-forward");

        $(".ui-icon.ui-icon-seek-end").wrap("<div class='btn btn-sm btn-default'></div>");
        $(".ui-icon.ui-icon-seek-end").removeClass().addClass("fa fa-fast-forward");

    })

    $(window).on('resize.jqGrid', function () {
        $("#jqgrid").jqGrid('setGridWidth', $("#content").width());
    })

</script>
    }

1 个答案:

答案 0 :(得分:0)

我在Create操作的代码中看不到任何明显错误。可能需要调试代码才能找到原因。主要有一件事,对于创建项目很重要:obj Create参数的属性。如果属性正确,那么jqGrid接口工作正常,问题的根源可能只在服务器端(您的C#代码和实体框架)。有一点,我建议你:替换行

db.AspNetUsers.Add(obj);

db.AspNetUsers.Add(new AspNetUser { UserName = obj.UserName, Email = obj.Email });

此外,我建议您将您使用的非常旧版本4.4.4(差不多5年)升级到“free jqGrid”的当前版本(4.15.2)。如果您使用NuGet包,则应将其卸载并安装包free-jqGrid。升级到免费的jqGrid后,您可以使用许多新功能。例如,free jqGrid包含Font Awesome 4.x的本机支持,这将简化您的代码。 gridComplete的使用也是不必要的。我建议您立即从服务器(从GetValues)返回所有数据并使用loadonce: true, forceClientSorting: true选项。它将简化您的代码。对于其他新功能,我建议您从头开始herethe wiki articlesREADMEs添加所有以前发布的版本。例如,https://jsfiddle.net/OlegKi/su7ebs65/演示了搜索的一些功能。