1

这是我的代码。

$(document).ready(function() {

    var kendoWindow_room = $("#window_room");
    kendoWindow_room.hide();

    $("#roombut").on(
            'click',
            function()
            {
                home_id = $("#home_id").val();
                if (home_id) {
                    kendoWindow_room.data("kendoWindow").open();
                    $('.k-window').css({'marginLeft': -$('.k-window').width() / 2});
                    dataSource.read();
                    $("#room_listview_pager .k-link:first").hide();
                    $("#room_listview_pager .k-link:last").hide();

                    $("#room_listview_pager a.k-link").each(function(index) {
                        $(this).addClass("pager_new_icons");
                        $(this).addClass("mortgage");
                    });
                }
            }
    );

    home_datasource = new kendo.data.DataSource({
        transport: {
            read: {
                url: "<?php echo BASE_URL . 'user/get_edit_home_name' ?>",
                dataType: "json"
            }
        }
    });
    room_datasource = new kendo.data.DataSource({
        transport: {
            read: {
                url: "<?php echo BASE_URL . 'common/get_dropdown_entries' ?>",
                dataType: "json",
                data: {thisisfor: "floortype"}
            }
        }
    });

    var crudServiceBaseUrl = "<?php echo BASE_URL . 'user/room_crud_listview_' ?>",
            dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: function() {
                    return crudServiceBaseUrl + "read?home_id=" + $("#home_id").val()
                },
                dataType: "json",
                contentType: "application/json"
            },
            update: {
                url: crudServiceBaseUrl + "update",
                dataType: "json",
                type: "POST"
            },
            destroy: {
                url: crudServiceBaseUrl + "destroy",
                dataType: "json",
                type: "POST"
            },
            create: {
                url: crudServiceBaseUrl + "create",
                dataType: "json",
                type: "POST"
            }
        },
        batch: true,
        pageSize: 1,
        schema: {
            model: {
                id: "id",
                fields: {
                    rd_home_id: "rd_home_id",
                    homename: "homename",
                    nickname: "nickname",
                    type: "type",
                    wallcolor: "wallcolor",
                    trimcolor: "trimcolor",
                    floorcolor: "floorcolor",
                    floortype: "floortype",
                    windows: "windows"
                }
            }
        }
    });

    $("#room_listview_pager").kendoPager({
        dataSource: dataSource,
        info: false,
        numeric: false
    });

    var room_listview = $("#room_listview").kendoListView({
        dataSource: dataSource,
        template: kendo.template($("#room_listview_template").html()),
        editTemplate: kendo.template($("#room_editview_template").html())
    }).data("kendoListView");


    // Add Row
    $("#room_add_row").on("click", function(event) {
        event.preventDefault();
        room_listview.add();
    });

    // Delete Row
    $("#room_delete_row").on("click", function(event) {
        event.preventDefault();
        room_listview.remove(room_listview.element.children().first());
        if (dataSource.total() < 1) {
            room_listview.add();
        } else {
            dataSource.read();
        }
    });

    // edit row
    $("#room_edit_row").on("click", function(event) {
        event.preventDefault();
        room_listview.edit(room_listview.element.children().first());
    });

    // save row
    $("#room_save_row").on("click", function(event) {
        event.preventDefault();
        room_listview.save();
    });

    if (!kendoWindow_room.data("kendoWindow")) {
        kendoWindow_room.kendoWindow({
            width: "520px",
            title: "Room Designer"
        });
    }

});

<div style="background-color: #FFFFFF; border: 0; max-width: 90px; float: left;" id="room_listview_pager"></div>
<span style="float: right; margin-top: 4px;">
    <a id="room_add_row" class="k-add" href="#"><img src="<?php echo STATIC_DIR; ?>images/icon7.png" alt="" height="36" width="37"></a>
    <a id="room_delete_row" class="k-delete" href="#"><img src="<?php echo STATIC_DIR; ?>images/icon8.png" alt="" height="36" width="37"></a>
    <a id="room_edit_row" class="k-edit" href="#"><img src="<?php echo STATIC_DIR; ?>images/icon9.png" alt="" height="36" width="37"></a>
    <a id="room_save_row" class="k-insert" href="#"><img src="<?php echo STATIC_DIR; ?>images/icon10.png" alt="" height="36" width="37"></a>
</span><div class="clear"></div>

This is the kendo template with id - "room_listview_template"
<div class="product-view k-widget">            
    <dl>    
        <dt>Home</dt>
        <dd>#:homename#</dd>            
        <dt>Nickname</dt>
        <dd>#:nickname#</dd>
        <dt>Type</dt>
        <dd>#:type#</dd>
        <dt>Wall Color</dt>
        <dd>#:wallcolor#</dd>
        <dt>Trim Color</dt>
        <dd>#:trimcolor#</dd>
        <dt>Floor Color</dt>
        <dd>#:floorcolor#</dd>
        <dt>Floor Type</dt>
        <dd>#:floortype#</dd>
        <dt>Windows</dt>
        <dd>#:windows#</dd>
    </dl>
</div>


This is the kendo template with id - "room_editview_template"

<div class="product-view k-widget">            
<dl>
    <dt>Home</dt>
    <dd>
        <select id="home" 
        data-role="dropdownlist" 
        data-text-field="nickname" 
        data-value-field="id"
        data-source="home_datasource" 
        data-bind="value:rd_home_id" 
        name="rd_home_id" 
        required="required" 
        validationMessage="required">
        </select>
        <span data-for="rd_home_id" class="k-invalid-msg"></span>
    </dd>
    <dt>Nickname</dt>
    <dd>
        <input type="text" class="k-textbox" data-bind="value:nickname" name="nickname" required="required" validationMessage="required" />
        <span data-for="nickname" class="k-invalid-msg"></span>
    </dd>
    <dt>Type</dt>
    <dd>
        <input type="text" class="k-textbox" data-bind="value:type" name="type" required="required" min="1" validationMessage="required" />
        <span data-for="type" class="k-invalid-msg"></span>
    </dd>
    <dt>Wall Color</dt>
    <dd>
        <input type="text" class="k-textbox" data-bind="value:wallcolor" name="wallcolor" required="required" validationMessage="required" />
        <span data-for="wallcolor" class="k-invalid-msg"></span>
    </dd>
    <dt>Trim Color</dt>
    <dd>
        <input type="text" class="k-textbox" data-bind="value:trimcolor" name="trimcolor" required="required" validationMessage="required" />
        <span data-for="trimcolor" class="k-invalid-msg"></span>
    </dd>
    <dt>Floor Color</dt>
    <dd>
        <input type="text" class="k-textbox" data-bind="value:floorcolor" name="floorcolor" required="required" validationMessage="required" />
        <span data-for="floorcolor" class="k-invalid-msg"></span>
    </dd>
    <dt>Floor Type</dt>
    <dd>
        <select 
        data-role="dropdownlist" 
        data-text-field="name" 
        data-value-field="value"
        data-source="room_datasource" 
        data-bind="value:floortype" 
        name="floortype" 
        required="required" 
        validationMessage="required">
        </select>
        <span data-for="floortype" class="k-invalid-msg"></span>
    </dd>
    <dt>Windows</dt>
    <dd>
        <input type="text" class="k-textbox" data-bind="value:windows" name="windows" required="required" validationMessage="required" />
        <span data-for="windows" class="k-invalid-msg"></span>
    </dd>
</dl>
</div>

我在 kendowindow 中有一个列表视图,其中包含创建、读取、更新和删除的选项。

它使用一个模板列出记录并使用另一个模板进行编辑。

在字段中,我有一个下拉列表,字段名称为“rd_home_id”,其数据文本字段和数据值字段不同。它将家庭名称显示为选项,每个选项都有其整数值。

插入和更新工作正常,我在服务器端得到整数值。

在阅读时,显然我想显示家庭名称 - 所以,我有字段名称“homename” - 从服务器,我传递了这个值,我可以在列表模板中看到它 - 效果很好。

剩下的唯一问题是 - 在我插入一条记录后,“homename”没有出现 - 它的 null - 所有其他值都显示出来并且是正确的。

如何在插入后立即显示值“homename”?

我知道我可以在调用 listview 的保存函数后立即调用 room_save_row 的 onclick 中数据源的读取函数 - 这将解决问题,但这样做会使验证不起作用。

有没有办法改变模板中呈现的字段的值?

谢谢

刚刚解决了问题

如果插入的记录作为来自服务器的响应(来自创建 URL)发送 - 它会被更新 - 并且该值将反映在列表模板中 - 在我没有从服务器发送任何内容之前。这就是问题所在。

4

0 回答 0