2017-02-03 1 views
0

Главная страницаHTML Помощники для автозаполнения не является обязательным в inlineFormtemplate в EJ-DataGrid -Syncfusion

<ej-grid id="State" allow-paging="true" allow-filtering="true" allow-sorting="true" virtual-loading="true" 
       is-responsive="true" height="500" allow-multi-sorting="true" enable-touch="true" common-width="10"> 
      <e-filter-settings filter-type="Menu" /> 
      <e-datamanager adaptor="UrlAdaptor" url="/State/GetAll" update-url="/State/Update" insert-url="/State/Update" /> 

      <e-edit-settings allow-deleting="true" allow-editing="true" allow-adding="true" 
          edit-mode="InlineFormTemplate" inline-form-template-id="#template"/> 
      <e-toolbar-settings show-toolbar="true"        
           toolbar-items='@new List<string> {"search","add","edit","delete", "excelExport", "pdfExport", "wordExport"}' /> 



      <e-columns> 
       <e-column header-text="Test Col" visible="true" 
          Template="<a href=/state/Edit?AutoId={{:StateMasterAutoId}}>Edit</a>" width="12" priority="1" /> 
       <e-column field="StateMasterAutoId" header-text="ID" is-primary-key="true" width="10" visible="false" /> 
       <e-column field="StateId" header-text="StateId" width="20" /> 
       <e-column field="StateName" header-text="State Name" width="50" /> 
       <e-column field="CountryName" header-text="Country Name" visible="false" width="50" /> 
       <e-column field="StateShortname" header-text="Short Name" width="50" /> 
       <e-column field="CountryId" header-text="Country Id" visible="false" width="50" /> 
      </e-columns> 
      <e-sort-settings> 
       <e-sorted-columns> 
        <e-sorted-column field="StateMasterAutoId" direction="Ascending" /> 
       </e-sorted-columns> 
      </e-sort-settings> 
     </ej-grid> 
@Html.Partial("statepartial") 

Statepartial

<script id="template" type="text/template"> 

      <form action="/state/edit" method="post"> 
       <table cellspacing="10"> 
        <tr> 
         <td>State ID</td> 
         <td> 
          <input id="StateId" name="StateId" disabled="disabled" value="{{:StateId}}" class="e-field e-ejinputtext" style="width:116px;height:28px" /> 
         </td> 
         <td>StateMasterAutoId</td> 
         <td> 
          <input id="StateMasterAutoId" name="StateMasterAutoId" disabled="disabled" class="e-field e-ejinputtext" style="width:116px;height:28px" /> 
         </td> 
         <td>State Name</td> 
         <td> 
          <input id="StateName" name="StateName" value="{{:StateName}}" class="e-field e-ejinputtext" style="width: 116px; height: 28px" /> 

         </td> 
        </tr> 
        <tr> 
         <td>Country ID</td> 
         <td> 

          @{Html.EJ().Autocomplete("CountryId").Width("200").PopupWidth("350px").PopupHeight("300px").WatermarkText("enter country name") 
           .FilterType(FilterOperatorType.Contains).ShowPopupButton(true).MinCharacter(2).ItemsCount(20).EnableDistinct(true) 
           .ShowRoundedCorner(true).ShowResetIcon(true).EnableAutoFill(true).HighlightSearch(true).ShowRoundedCorner(true).ShowResetIcon(true) 
            .Datasource(ds => { ds.URL("/Lookup/LookUps?LookUpId=country"); ds.Key("CountryMasterAutoId"); ds.Adaptor("UrlAdaptor"); }) 
            .AutocompleteFields(f => f.Text("CountryName").Key("CountryMasterAutoId")) 
            .Query("ej.Query().select('CountryMasterAutoId','CountryName')") 
            .MultiColumnSettings(mc => mc.Enable(true).Columns(obj1 => 
            { 
             obj1.Field("CountryName").HeaderText("Country Name").Add(); 
             obj1.Field("CountryMasterAutoId").HeaderText("ID").Add(); 

            }).ShowHeader(true).StringFormat("{0}")) 
          .Visible(true).Render(); } 




         </td> 
        </tr> 

       </table> 
      </form> 

     </script> 

Output HTML Помощники для автозаполнения не делает внутри

<script type="text/template">...</script> 

Taghelpers для автозаполнения также не работает внутри тега сценария

, как я могу получить автозаполнения поля внутри inlineTemplateform

ответ

1

Мы можем оказать HTML элемент в одиночку внутри тега сценария с типом jsrender. Итак, нам нужно указать входной элемент внутри шаблона и отобразить ejAutoComplete, используя этот элемент в событии ActionComplete элемента управления Grid.

Частичный вид

<script id="template" type="text/template"> 

      <form action="/state/edit" method="post"> 
       <table cellspacing="10"> 

        <tr> 
         <td>Country ID</td> 
         <td> 
          <input id="CountryId" name="CountryId" value="{{:CountryId}}" class="e-field e-ejinputtext" style="width: 116px; height: 28px" /> 
         </td> 
        </tr> 

       </table> 
      </form> 

     </script> 

Index Page

function onActionComplete(args) { 
     if (args.requestType == "beginedit" || args.requestType == "add") { 

      var ele = $(".gridform").find("#CountryId"); 
      //Render ejAutoComplete inside edit form 
      ele.ejAutocomplete({ width: "100%", dataSource: data, enableDistinct: true, fields: { text: "CountryId", key: "CountryId" },filterType: ej.filterType.StartsWith }); 
     } 
    } 
Смежные вопросы