2012-06-14 18 views
8

मैं जैसे किसी भी नियंत्रक में WebGrid का उपयोग करने में सक्षम हूँ:एक सीएसएसटीएम दृश्य में WebGrid का उपयोग कैसे करें?

var grid = new WebGrid(emailsFetched, columnNames);

मैं इसके लिए System.Web.Helpers करने के लिए अपने ASP.NET MVC परियोजना में एक संदर्भ जोड़ने के लिए किया था।

लेकिन जब मैं में इस वेब ग्रिड का उपयोग करने की कोशिश करता हूं तो सीधे देखें (तात्कालिकता और नियंत्रक में अन्य सेटिंग्स से बचने के लिए) यह कहता है: The type or namespace 'WebGrid' cannot be found। ठीक है, मैं एक संदर्भ जोड़ने के लिए यहाँ भी करने की कोशिश की:

@using System.Web.Helpers लेकिन यह एक और मुद्दा फेंकता है:

There is no build provider registered for the extension '.cshtml'. You can register one in the <compilation><buildProviders> section in the machine.config or web.config. Make sure is has a BuildProviderAppliesToAttribute attribute which includes the value 'Web' or 'All'.

यह सुंदर अजीब है ... मैंने देखा है पर्याप्त उदाहरण नेट पर जो प्रयोग कर रहे हैं WebGrid और cshtml ध्यान में रखते हुए कुछ भी घोषित करने के लिए नहीं है ...

क्या आप मुझे बता कि यह कैसे हल करने के लिए कर सकते हैं? या मुझे इस बदसूरत मुद्दे का सामना क्यों करना है?

उत्तर

22

अंत में मुझे लगता है कि यह नोटिस कर लिया है:

<assemblies> <add assembly="System.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> </assemblies>

system.web धारा के तहत, वेब config में जोड़ा जाना आवश्यक है, compilation टैग के भीतर तो यह तरह दिखेगा:

<system.web> 
    <compilation debug="true" targetFramework="4.0"> 
     <assemblies> 
      <add assembly="System.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> 
     </assemblies> 
    </compilation> 
</system.web> 
6

किसी भी समस्या के बिना ASP.NET MVC4 प्रोजेक्ट में पहले परीक्षण किए गए चरणों का पालन करने का प्रयास करें।

1)Visual Studio में खोलें NuGet Package Manager और खोज "माइक्रोसॉफ्ट-वेब-सहायक" और स्थापित करें।

2) यह अपने समाधान में web.config खोलने के लिए और DefaultMembershipProvider के लिए connectionStringName पैरामीटर, DefaultRoleProviderDefaultSessionProvider ve (यदि आप नहीं करते हैं, आपके सामने आ सकने बदल स्थापित करने के बाद 'DefaultConnection' अनुप्रयोगों विन्यास में नहीं मिला था या कनेक्शन स्ट्रिंग है खाली। "त्रुटि।

3) अपनी परियोजना को पुनर्निर्माण करें और फिर अपने रेजर व्यू में नीचे की तरह एक स्माइली परिभाषा का उपयोग करें।

नोट:"शीर्षक" अपनी परियोजना के अनुसार, "नियंत्रक" और "कार्रवाई"Html.ActionLinks में नाम बदलें।

दृश्य:

@{ 
var grid = new System.Web.Helpers.WebGrid(
    source: Model, 
    columnNames: new List<string>() { "Title" }, 
    ajaxUpdateContainerId: "myGrid", 
    defaultSort: "Name", 
    canPage: true, 
    canSort: true, 
    rowsPerPage: 5 
    ); 
grid.SortDirection = SortDirection.Ascending; 
} 


@grid.GetHtml(
     tableStyle: "table", /*your class name for this property*/ 
     headerStyle: "webgrid-header",/*your class name for this property*/ 
     footerStyle: "webgrid-footer", /*your class name for this property*/ 
     rowStyle: "webgrid-row-style", /*your class name for this property*/ 
     alternatingRowStyle: "webgrid-alternating-row",/*your class name...*/           selectedRowStyle: "webgrid-selected-row",/*your class name for this property*/ 

     firstText: "<<", 
     lastText: ">>", 
     mode: WebGridPagerModes.All, 
     fillEmptyRows: true, 

     columns: grid.Columns(
     grid.Column("ApplicantID", "No", style: "span1", canSort: true), 
     grid.Column("Name", "Name", style: "span2", canSort: true), 
     grid.Column("Surname", "Surname", style: "span2", canSort: true), 
     grid.Column("Organization", "Org.", style: "span2", canSort: true), 
     grid.Column("MeetingId", "Meeting", style: "span1", canSort: true), 
     //some format usage samples: 
     //grid.Column("Email", "e-mail", style: "span1", canSort: true, format: @<a href="mailto:@item.Email">@item.Email</a>), 
     //grid.Column("BirthDate", format: p=>p.BirthDate.ToShortDateString()), 

//for using multiple Html.ActionLink in a column using Webgrid 
grid.Column("Operations", format: (item) => 
new HtmlString(
     Html.ActionLink("Show Details", "Edit", "Admin", new 
     { 
      applicantId = item.ApplicantID,    
      title = "Detail", 
      @class = "icon-link", 
      style = "background-image: url('../../Content/icons/detail.png')" 
     }, null).ToString() + 
     Html.ActionLink("Edit Record", "Edit", "Admin", new 
     { 
      applicantId = item.ApplicantID, 
      title = "Edit", 
      @class = "icon-link", 
      style = "background-image: url('../../Content/icons/edit.png')" 
     }, null).ToString() + 
     Html.ActionLink("Delete Record", "Edit", "Admin", new 
     { 
      applicantId = item.ApplicantID, 
      title = "Delete", 
      @class = "icon-link", 
      style = "background-image: url('../../Content/icons/delete.png')" 
     }, null).ToString() 
) 
) 
), 
numericLinksCount: 5 
) 


यहाँ css कक्षाएं Razor में प्रयोग किया जाता से नीचे हैं।यदि आप अपनी css परिभाषाओं का उपयोग करना चाहते हैं तो परिभाषाएं केवल आपके लिए शैली गुणों को बदल दें (कुछ गुण Razor View में वैकल्पिक हैं)।

<style type="text/css">  
    .webgrid-operations { /*for limiting the width of Operations 
          menu used in the WebGrid*/ 
    width: 65px; 
} 

.webgrid-header td { 
    text-align: left; 
} 

.webgrid-header th { 
    background-color: #EFEFEF; 
    margin-bottom: 2px; 
} 

.webgrid td { 
    padding-right: 15px; 
} 

.webgrid-footer td { 
    font-family: 'open_sanssemibold', sans-serif; 
    font-size: 1em; 
    text-align: right !important; 
    padding-right: 21px !important; 
    color: #000; 
    background-color: #EFEFEF; 
} 

    .webgrid-footer td a { 
     text-align: right !important; 
     padding: 0 .4em 0 .4em; 
     font-size: .83em; 
     text-decoration: none; 
     color: #FFFFFF; 
     border: 1px solid #C0C0C0; 
     background-color: #808080; 
    } 

     .webgrid-footer td a:hover { 
      background-color: #6BBEC7; 
     } 

     .webgrid-footer td a.selected { 
      background-color: #f00; 
      color: #f00; 
     } 

.webgrid a { 
    color: #fff; 
} 

.colRowButton { 
    width: 70px; 
    text-align: left; 
} 

.webgrid-row-style { 
    /*border-bottom: 1px solid #E8EEF4;*/ 
} 

.webgrid-alternating-row td { 
    /*background-color: #f9f9f9;*/ 
} 

.webgrid-selected-row { 
    /*font-weight: bold;*/ 
}  

<style type="text/css"> 
    a.icon-link { 
     background-color: transparent; 
     background-repeat: no-repeat; 
     background-position: 0px 0px; 
     border: none; 
     cursor: pointer; 
     width: 16px; 
     height: 16px; 
     margin-right: 8px; 
     vertical-align: middle; 
    } 

    .span5 { 
    width:380px 
    } 
    .span4 { 
    width:300px 
    } 
    .span3 { 
    width:220px 
    } 
    .span2 { 
    width:140px 
    } 
    .span1 { 
    width:60px 
    } 
    </style> 
} 


आशा इस मदद करता है ...

0

इस मामले की छानबीन Ran। वास्तव में क्रेडिट नहीं ले सकता है लेकिन मैंने पहले संस्करण को अनइंस्टॉल किया और Nuget से माइक्रोसॉफ्ट एएसपी.नेट एमवीसी 4 के नवीनतम संस्करण को पुनर्स्थापित किया और चीजें मेरे लिए काम कर रही हैं। मनाइए कि यह किसी और के लिए सहायक हो। सभी समाधानों का प्रयास किया, लेकिन यह एकमात्र चीज थी जो काम करती थी। http://forums.asp.net/t/1823940.aspx?MVC4+WebGrid+problem+in+View+Razor+