2012-05-21 19 views
9

İçinde telerik ızgarası olan tek bir mod penceresi var. Ama benim kılavuzumda resim yapmam gerekiyor ki anladığım kadarıyla iki kere kullanamam. İşte bu yazı hakkında blog yazısı var. LinkSatır içi işaretleme blokları yuvalanamaz. Yalnızca tek bir satır içi işaretlemeye izin verilir. MVC RAZOR

Birisi bana yardımcı olabilir.

Benim Kod

@{ Html.Telerik().Window() 
    .Name("images") 
    .Title("Select an Image") 
    .Content(@<text> 

@(Html.Telerik().ComboBox() 
      .Name("AjaxComboBox66") 
      .AutoFill(true) 
      .SelectedIndex(0) 
      .BindTo(new SelectList(Model.PhotoFolders, "ID", "Name")) 
      .Filterable(filtering => filtering.FilterMode(AutoCompleteFilterMode.StartsWith)) 
      .HighlightFirstMatch(true) 
      .ClientEvents(events => events 
       .OnChange("onChange") 
      ) 
    ) 

     @(Html.Telerik().Grid<AjaxImages>() 
    .Name("Grid") 
    .DataKeys(keys => keys.Add(c => c.ID)) 
    .Columns(columns => 
    { 
     columns.Template(
      @<text> 
       <img src='@item.Url' /> 
//Here is my error. I need helper function 
      </text> 

).Title("Picture"); 

    }) 

           .DataBinding(dataBinding => dataBinding.Ajax().Select("GetImages", "UserProducts")) 

         .Scrollable(scrolling => scrolling.Enabled(true)) 
         .Sortable(sorting => sorting.Enabled(true)) 
          .Pageable(paging => paging.Enabled(true).PageSize(20).Total(100).Style(GridPagerStyles.NextPreviousAndNumeric)) 
         .Filterable(filtering => filtering.Enabled(true)) 
         .Groupable(grouping => grouping.Enabled(false)) 
         .EnableCustomBinding(true) 

         .Footer(true)) 
       </text>) 
    .Width(400) 
    .Draggable(true) 
    .Modal(true) 
    .Visible(false) 


    .Render(); 
} 

My GetImages fonksiyonu "ID" ve "URL" json beni dönün.

cevap

16

Bu durumlarda MVC Razor yardımcı işlevi kullanılabilir. Izgara denetim tanımıyla yardımcı işlevi oluşturun, bu durumda RenderGrid().

@helper RenderGrid() 
{ 
    @(Html.Telerik().Grid<AjaxImages>() 
    .Name("Grid") 
    .DataKeys(keys => keys.Add(c => c.ID)) 
    .Columns(columns => 
    { 
     columns.Template(
     @<text> 
      <img src='@item.Url' /> 
     </text> 
     ).Title("Picture"); 
    }) 
    .DataBinding(dataBinding => dataBinding.Ajax().Select("GetImages", "UserProducts")) 
} 

Pencerenin içerik tanımında yardımcı işlevini çağırın. Yardımcı fonksiyonlar gerektiğinde birden fazla kez çağrılabilir. Önceki MVC @helper olarak

@{Html.Telerik().Window() 
     .Name("images") 
     .Title("Select an Image") 
     .Content(
     @<text> 
      @RenderGrid() 
     </text>) 
     .Width(400) 
     .Draggable(true) 
     .Modal(true) 
     .Visible(false) 
     .Render(); 
} 
+0

Neredeyse bitti, her iki ekran görüntüleri kontrol edin. Herhangi bir hata alamıyorum ancak resim boş. Metin olarak render etmeye çalıştım, ajax'ım çalışıyor. Resimlerimi neden alamadığımı biliyor musun? http://prntscr.com/9ix3a http://prntscr.com/9ix3x –

+2

ajax bağlayıcısını kullanıyorsunuz ve bu nedenle sunucu ciltleme modu şablonu yerine istemci tarafı şablonunu kullanmanız gerekiyor. Bunu deneyin: 'columns.Bound (c => c.ID) .ClientTemplate (" <#= ID #> "src = ' />") Başlık ("Resim"); ' – Igorrious

+0

Doğru cevap! U kural! –