Question

我填充了动态输入表单字段。它已成功填充。我不知道如何使用put / post api将数据保存到数据库中。因为我用过api。

html代码

<div id="renderform" class="form horizontal-form form-body">
        <!-- container UL to host input fields -->
        <div class="row" data-template="fieldsTemplate" data-bind="source:fields">

        </div>
    <!-- button to save changes -->
    <button id="save" class="btn btn-circle  btn-sm btn-default" type="button">Save</button>
</div>

剑道模板

<script id="fieldsTemplate" type="text/x-kendo-template">
    <div class="form-group">
        <label class="control-label" data-bind="attr: { for: name}, text: ItemLabel"></label>
        <div class="">
            <input class="form-control-static" type="text" />
        </div>
    </div>
</script>

ajax功能

<script type="text/javascript">
    // retrieve the model from an API call
    $.ajax({
        url: crudServiceBaseUrl + "FormItemsDesign/GetFormItemsDesignList?parentid=" + formdesignid,
        //url :"json.txt",
        type: "GET",
        dataType: "json",
        success: function (model) {
            // convert the JSON to observable object
            var viewModel = kendo.observable(model);
            // bind the model to the container
            kendo.bind($("#renderform"), viewModel);
        }
    });
</script>

Post / Put api就像

url: crudServiceBaseUrl + "FormItemsDesign
type:Post
type:Put

请帮助我，如何使用ajax函数调用Post / Put将每个动态字段保存/更新数据到数据库中。我提前感谢您宝贵的时间和精力。

Answer 1

在阅读了更多文章后，我找到了这个解决方案。它为我工作。

$("#save").on("click", function () {

        $("#renderform input").each(function () {
            var dataModel = {
                parentid: $(this).attr("id"),
                ItemOrder: "1",
                ItemFieldType: "1",
                ColWidth: "100",
                RowHeight: "100",
                ItemText: $(this).val(),
                ItemLabel: $(this).attr("name")
            };
            $.ajax({
                type: 'POST',
                url: crudServiceBaseUrl + "FormsItem?firmid=" + firmid + "&createdby=" + clientid,
                data: JSON.stringify(dataModel),
                contentType: 'application/json; charset=utf-8',
                dataType: 'json'
            });
        });
        alert("Data Saved successfully");
    });

将动态输入表单数据保存到数据库kendo ui中

1 个答案: