Question

我正在尝试创建一个可重用的模板，我可以在两种情况下使用它，当提供给它的模型为null时，以及它不是。我不知道在两种不同情况下尝试使用模板是否是最佳做法，但我只是认为重用代码可能很简洁。提供模型时，将自动填充文本字段。当它不是时，它们应该是空白的。此模板位于我使用jQuery TOOLS library显示的模式对话框中。

我遇到的问题是，当提供给模板的模型为null时，模式对话框不会弹出。期望的结果是，当提供模型时，将自动填充文本字段，允许用户编辑和保存记录，而如果未提供模型，则文本字段将为空白，用户可以填充它们在中创建一个新记录。但是我甚至无法在模型空白时显示模态div。它至少还不能用静态内容显示吗？像文本字段标签和文本字段本身一样？这是有关的标记：

<div class = "modal" id = "recordDetails">
        <div id="details"></div>
        <button id="save" class="close" type="button"/> Save </button>
        <button id="cancel" class="close" type="button"> Cancel </button>
        <div id="error_messages"></div>
    </div>

＆＃34;细节＆＃34;是我使用此控制器操作渲染模板的div：

def displayRecordDetails() {
        println "<><><> Displaying record details."
        def recordToEdit = IndividualRecord.findWhere(batchID: selectedBatch.id, uniqueId: params.uniqueId, secondaryId: params.secondaryId)
        println "<><>< Record to edit: " + recordToEdit
        render(template: 'detailsScreen', model: [recordToEdit: recordToEdit])
    }

这里是模板本身被渲染到＆＃34;细节＆＃34; DIV：

<h2><u> Edit Record Details</u></h2>
<div id=container>
    <g:formRemote name="editIndivRecForm" url="[controller: 'customer', action:'saveEditedIndividualRecord']">
        <div style="text-align: left">
            <label>Unique ID:</label>&nbsp<g:textField name="uniqueId" disabled="true" style="border-radius: 5px" value="${recordToEdit ? recordToEdit.uniqueId : '' }"></g:textField><br> 
            <label>Secondary ID:</label>&nbsp<g:textField name="secondaryId" disabled="true" style="border-radius: 5px" value="${recordToEdit ? recordToEdit.secondaryId : '' }"></g:textField><br> 
        </div>  
        <hr>
        <div style="text-align: left">
            <label>First Name:</label>&nbsp<g:textField name="firstName" style ="border-radius: 5px" value="${recordToEdit ? recordToEdit.names.first().firstName : ''}"></g:textField>&nbsp&nbsp
            <label>Middle Name:</label>&nbsp<g:textField name="middleName" style ="border-radius: 5px" value="${recordToEdit ? recordToEdit.names.first().middleName : ''}"></g:textField>&nbsp&nbsp
            <label>Last Name:</label>&nbsp<g:textField name="lastName" style ="border-radius: 5px" value="${recordToEdit ? recordToEdit.names.first().lastName : ''}"></g:textField><br> 
            <label>Date of birth(mm-dd-yyyy):</label>&nbsp<g:textField name="dateOfBirth" style ="border-radius: 5px" 
                    value="${recordToEdit?.dateOfBirth ? Date.parse( 'EEE MMM d HH:mm:ss Z yyyy', recordToEdit.dateOfBirth).format( 'dd-MM-yyy' ) : ''}"></g:textField><br> 
        </div>  
        <hr>
        <div style="text-align: left">
            <label>Citizenship(two letter country code):</label>&nbsp<g:textField name="citizenship" style ="border-radius: 5px" value="${recordToEdit ? recordToEdit.citizenship : ''}"></g:textField><br> 
            <label>Citizenship Proof:</label>&nbsp<g:textField name="citizenComments" style ="border-radius: 5px" value="${recordToEdit ? recordToEdit.citizenshipComments : ''}"></g:textField><br> 
            <label>Phone(aaa-bbb-cccc):</label>&nbsp<g:textField name="phone" style ="border-radius: 5px" value="${recordToEdit?.telephones?.getAt( 0 ) ?: ''}"></g:textField><br> 
        </div>  
        <hr>
        <div style="text-align: left">
            <label>Address:</label>&nbsp<g:textField name="address" style ="border-radius: 5px" 
                    value="${recordToEdit?.addresses?.first()?.address ? recordToEdit.addresses.first().address : ''}"></g:textField><br>  
            <label>City or Town:</label>&nbsp<g:textField name="cityTown" style ="border-radius: 5px"
                    value="${recordToEdit?.addresses?.first()?.cityTown ? recordToEdit.addresses.first().cityTown : ''}"></g:textField><br>  
            <label>Country(two letter country code):</label>&nbsp<g:textField name="country" style ="border-radius: 5px"
                    value="${recordToEdit?.addresses?.first()?.countryCode ? recordToEdit.addresses.first().countryCode : ''}"></g:textField><br> 
        </div> 
        <hr>
        <label>Comments:</label><br>    
        <g:textArea name="generalComments" rows="5" cols="50" value="${recordToEdit?.generalComments}"/><br>
        <g:submitButton name="submit"/>
    </g:formRemote>
</div>

<script>
    $(document).ready(function() {

        $('#cancel').click(function () {
            $('#editIndivRecForm').reset;
        });

      //    $('#submit').click(function () {
            // $('.modalInput').overlay().close();
      //    });

        $('#save').click(function () {
            console.log('save');
            $("#submit").trigger("click");
            $('#editIndivRecForm').reset;

        });
    });
</script>

<style>
    #uniqueId {
        width: 90%;
    }

    #submit {
        visibility: hidden;
    }
</style>

启动此模式的两个案例是“编辑”时的情况。在表的任何一行上按下图标按钮以编辑该记录（在这种情况下提供模型）。或者当新的＆＃39;需要创建新记录时按下按钮（未提供型号）。见下图。

enter image description here

Answer 1

您的“新”按钮应如下所示：

<button id = "new" class = "modalInput" rel = "#recordDetails"> New </button>

Answer 2

在你的控制器中使用它：

def recordToEdit = IndividualRecord.findWhere(batchID: selectedBatch.id, uniqueId: params.uniqueId, secondaryId: params.secondaryId) ?: new IndividualRecord()

如果搜索没有返回值，则会为您创建一个新对象。

也许这可以解决你的问题

祝你好运。

当模板模型为空时，Grails模态对话框不会显示

2 个答案: