2010-07-19 12 views
6

en el control de usuario mvc llamado form.ascx, tengo una Telerik Grid contenida en un div llamado "detalles".usando la cuadrícula telerik con el diálogo jquery ui!

de una página llamada Edit.aspx escribí lo siguiente:

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 
    <div id="details"> 
     <%Html.RenderPartial("form", Model != null ? Model.CurrentEntity : null); %> 
    </div> 
    <script type="text/javascript" language="javascript"> 
     $(document).ready(function() { 
      $('#details').dialog(
      { modal: true, 
       title: "add", 
       width: 815, 
       buttons: { 
        'save': function() { $("form:first").trigger("submit"); }, 
        'close': function() { $(this).dialog('close'); } 
       } 
      }); 
     }); 
    </script> 
</asp:Content> 

el problema es el diálogo no se muestra !! y el control de usuario se muestra dentro de la página maestra como si no estuviera usando un diálogo.

dentro del control de usuario "formulario", cuando desactivo la cuadrícula, todo funciona bien y el cuadro de diálogo se muestra correctamente. cuando utilicé el firebug para resolver el problema, apareció el siguiente error:

$ no está definido ????

cualquier cuerpo tiene una idea ??

aquí es la página maestra:

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %> 
    <%@ Import Namespace="Telerik.Web.Mvc.UI" %> 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
    <head> 
     <link type="text/css" href="../../Content/Site.css" rel="stylesheet" /> 
     <link type="text/css" href="../../content/css/start/jquery-ui-1.8.2.custom.css" rel="Stylesheet" /> 
     <script type="text/javascript" src="/Scripts/jquery-1.4.2.js"></script> 
     <script type="text/javascript" src="/Scripts/jquery-ui-1.8.2.custom.js"></script> 
    <%--<script type="text/javascript" src="../../Scripts/Jquery.Validate.js"></script>--%> 
     <%--<script type="text/javascript" src="../../Scripts/MicrosoftMvcJQueryValidation.js"></script>--%> 
     <title> 
      <asp:ContentPlaceHolder ID="TitleContent" runat="server" /> 
     </title> 
    </head> 
    <body> 
    <%= Html.Telerik().StyleSheetRegistrar() 
     .DefaultGroup(group => group.Add("telerik.common.css") 
            .Add("telerik.outlook.css")) 
<!----- some html content only -----> 

     <div id="maincontent" class="fixed"> 
      <asp:ContentPlaceHolder ID="MainContent" runat="server"> 
      </asp:ContentPlaceHolder> 
     </div> 

    <asp:ContentPlaceHolder runat="server" ID="Footer" /> 
    <% Html.Telerik().ScriptRegistrar().DefaultGroup(group => { group.Add("telerik.examples.js").Compress(true); }). 
      OnDocumentReady(() => 
      { %>prettyPrint();<% }).Render(); %> 
</body> 
</html> 

y aquí es la vista parcial form.acsx:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Bereau.Core.IncommingCorrespondence>" %> 
<%@ Import Namespace="System.Web.Mvc.Html" %> 
<%@ Import Namespace="BureauModule.Utility" %> 
<%@ Import Namespace="Telerik.Web.Mvc.UI" %> 
<%--<%= Html.ValidationSummaryJQuery("Error must be fixed.", new Dictionary<string, object> { { "id", "valSumId" } })%>--%> 
<%--<% Html.EnableClientValidation(); %>--%> 
<% using (Html.BeginForm()) 
    { %> 
<%=Html.DisplayFor (c=>c.Photocopy) %> 
<%--<% ViewContext.FormContext.ValidationSummaryId = "valSumId"; %>--%> 
<form action="" method="post" id="customer_form" dir="rtl"> 
<div class="editor-label"> 
    <%:Html.LabelFor(c => c.Overstatment)%> 
    <%=Html.TextBoxFor(c => c.Overstatment,new { @class ="text ui-widget-content ui-corner-all"})%> 
    <%--<%= Html.ValidationMessageFor(model => model.Overstatment,"*") %>--%> 
</div> 
<div> 
    <label for="CorrespondenceNumber">CorrespondenceNumber:</label> 
    <%=Html.TextBoxFor(c => c.CorrespondenceNumber, new { @class = "text ui-widget-content ui-corner-all" })%> 
    <span> 
     <%--<%= Html.ValidationMessageFor(model => model.CorrespondenceNumber, "*")%>--%></span> 
</div> 
<div> 
    <label for="Nature">Nature:</label> 
    <%=Html.DropDownList("Nature")%> 
    <%--<%= Html.ValidationMessageFor(model => model.Nature, "*")%>--%> 
</div> 
<div> 
    <label for="Sender">Sender:</label> 
    <%=Html.DropDownList("Sender")%> 
    <%--<%= Html.ValidationMessageFor(model => model.Sender, "*")%>--%> 
</div> 
<div class="correspondenceReceiver"> 
    <% Html.Telerik().Grid<Bereau.Core.CorrespondenceDetail>(Model != null ? Model.Details : null) 
     .Name("Grid") 
     .DataKeys(keys => keys.Add(c => c.CorrespondenceDetailID)) 
     .HtmlAttributes(new { @class = "t-grid-rtl" }) 
     .Columns(columns => 
     { 
      columns.Bound(c => c.CorrespondenceDetailID).Visible(false); 
      columns.Bound(c => c.Sender).Title("Sender"); 
      columns.Bound(c => c.Count).Title("Count"); 
      columns.Bound(c => c.Date).Title("Date").Format("{0:yyyy/MM/dd}"); 
      columns.Bound(c => c.Notes).Title("Notes"); 
      columns.Command(c => c.Edit()); 
     }) 
     .ToolBar(t => t.Insert()) 
     .DataBinding 
     (c => c.Ajax() 
      .Select("Select", "IncommingCorespondence") 
      .Insert("InsertDetail", "IncommingCorespondence") 
      .Update("UpdateDetail", "IncommingCorespondence") 
      ) 
     .Scrollable() 
     .Sortable() 
     .Pageable() 
     .Render(); 
    %> 
    <% Html.Telerik().ScriptRegistrar().OnDocumentReady(() => 
     { 
    %> 
    $('.insert-button').click(function(e) { e.preventDefault(); $('#Grid').data('tGrid').createRow(); 
    }); 
    <% }); %> 
</div> 
<input type="submit" runat="server" /> 
<% } %> 
</form> 
+0

¿Puedes publicar más información? La página maestra y la vista parcial serían de ayuda. –

+0

hola korchev, gracias por la respuesta, modifiqué la pregunta y agregué más información. –

Respuesta

2

me di cuenta del problema:

He desactivado los siguientes archivos de comandos (que ya están deshabilitados en la situación):

<%--<script type="text/javascript" src="../../Scripts/Jquery.Validate.js"></script>--%> 
<%--<script type="text/javascript" src="../../Scripts/MicrosoftMvcJQueryValidation.js">/script>--%> 

y cambió el siguiente código:

% Html.Telerik().ScriptRegistrar().DefaultGroup(group => { group.Add("telerik.examples.js").Compress(true); }). 
      OnDocumentReady(() => 
      { %>prettyPrint();<% }).Render(); %> 

a

<% Html.Telerik().ScriptRegistrar(); %> 

no sé cómo hizo esto resuelve el problema.

y no soy tan profesional en JavaScript.

13

Cuando utiliza el Telerik ScriptRegistrar, de forma predeterminada se mostrará un enlace a jQuery en la parte inferior de la página. Si tiene un código "más alto" en su página que necesita jQuery, o si está agregando jQuery manualmente a su página (como en el ejemplo del código), puede deshabilitar el comportamiento del ScriptRegistrar, así:

Html.Telerik().ScriptRegistrar().jQuery(false).Render(); 

También tenga en cuenta que no necesita el "telerik.examples.js" o el "prettyPrint();" código a menos que realmente estés usando ese código. Estos recursos se usan en las demostraciones de Telerik, pero normalmente no en otros sitios web.

Debería poder actualizar su ScriptScript como se muestra arriba y luego volver a habilitar sus scripts de validación de jQuery sin problema.

Como nota final, si se va a utilizar la compresión ScriptRegistrar, es necesario registrar el Activo HttpHandler en su web.config:

<add verb="GET,HEAD" path="asset.axd" validate="false" type="Telerik.Web.Mvc.WebAssetHttpHandler, Telerik.Web.Mvc"/> 

Más detalles son available in the online docs.

+0

Gracias Todd, tienes razón. –

Cuestiones relacionadas