2010-08-22 1 views
1

Я пытаюсь разместить редактор Markdown внутри вкладок jQuery-UI, но редактор не отображается.Не может быть, чтобы обернуть редактор Markdown Markdown внутри вкладок JQuery

<% Using Html.BeginForm()%> 
    <div id="AddEventWizard"> 
     <ul> 
      <li><a href="#tabs-1">Event Title</a></li> 
      <li><a href="#tabs-2">Event Description</a></li> 
     </ul> 
     <div id="tabs-1"> 
      <%: Html.LabelFor(Function(model) model.Name)%> 
      <%: Html.TextBoxFor(Function(model) model.Name, New With{.class = "full-width-input"})%> 
      <%: Html.ValidationMessage("Name", "*")%> 
     </div> 
     <div id="tabs-2"> 
      <noscript><h3>Please use 
       <%: Html.ActionLink("Markdown", "Markdown", "About")%> 
       to style your input.</h3></noscript> 
      <div id="wmd-button-bar" class="wmd-panel"> 
      </div> 
      <%: Html.TextAreaFor(Function(model) model.Description, 5, 10, New With {.id = "wmd-input", .class = "wmd-panel"})%> 
      <div id="wmd-preview" class="wmd-panel"> 
      </div> 
      <div class="clear"> 
      </div> 
     </div> 
    </div> 
    <% End Using%> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('textarea#wmd-input:not(.processed)').TextAreaResizer(); 

     $("#AddEventWizard").tabs({ 

    }); 
}); // closes document.ready 

</script> 

Существует пространство, в котором кнопки редактора должны быть, но их там нет. Кто-нибудь знает, что материал jQuery-UI каким-то образом блокирует MarkD Markdown?

Screenshot


Edit:

Я использую версию от Github

HTML Markup

<form action="/events/addevent" method="post"> 
     <div id="AddEventWizard"> 

      <ul> 
       <li><a href="#tabs-1">Event Title</a></li> 
       <li><a href="#tabs-2">Event Details</a></li> 
       <li><a href="#tabs-3">Event Description</a></li> 
      </ul> 
      <div id="tabs-1"> 
       <label for="Name">Name</label> 

       <input class="full-width-input" id="Name" name="Name" type="text" value="" /> 

      </div> 
      <div id="tabs-2"></div> 
      <div id="tabs-3"> 
       <noscript><h3>Please use 
        <a href="/about/markdown">Markdown</a> 
        to style your input.</h3></noscript> 
       <div id="wmd-button-bar" class="wmd-panel"> 
       </div> 
       <textarea class="wmd-panel" cols="10" id="wmd-input" name="Description" rows="5"> 

</textarea> 
       <div id="wmd-preview" class="wmd-panel"> 
       </div> 
       <div class="clear"> 
       </div> 
      </div> 
     </div> 
     </form> 


<script type="text/javascript"> 
    $(document).ready(function() { 
     $('textarea#wmd-input:not(.processed)').TextAreaResizer(); 

     $("#AddEventWizard").tabs({ 

    }); 
}); // closes document.ready 

</script> 
<script src="../../Assets/Scripts/wmd.js" type="text/javascript"></script> 
<script src="../../Assets/Scripts/showdown.js" type="text/javascript"></script> 
<script src="../../Assets/Scripts/MicrosoftAjax.js" type="text/javascript"></script> 
<script src="../../Assets/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script> 
<script src="../../Assets/Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script> 

<script src="../../Assets/Scripts/jquery.textarearesizer.compressed.js" type="text/javascript"></script> 
+0

Какая версия вы используете, оригинал из накладок или сообщества отредактировал один из github? Кроме того, было бы неплохо создать фактический HTML-код, поскольку я не считаю, что ваш код ASP имеет какое-то отношение к нему. –

+0

Я уточнил свой вопрос. –

+0

Я также пробовал это с аккордеоном и получил те же результаты. –

ответ

0

Может быть, вы можете связать редактор

$('textarea#wmd-input:not(.processed)').TextAreaResizer(); 

не на $ (документе). Уже, но на клик tab3?

таким образом, редактор загружается, когда текстовое поле видимо.