JQuery на странице содержимого не выполняется - PullRequest
Новая
       2

JQuery на странице содержимого не выполняется

2 голосов
/ 25 июля 2011

Я пытался заставить плагин jquery datepicker работать на контентной странице, но не смог заставить страницу выполнить jquery вообще.Мне удалось заставить программу выбора даты работать на моей главной странице, но не на странице контента.Также инструмент Firebug для Firefox не обнаружил никаких ошибок JavaScript.Если у кого-то есть решение для того, чтобы заставить средство выбора даты работать на моей странице содержания, это было бы замечательно.Заранее спасибо.

.ASPX: 

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
  <script type="text/javascript">
    $(document).ready(function () {
      $("#TextBoxConnectedOn").datepicker();
    });
  </script>
</asp:Content> 

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
  <input type="text" name="TextBoxConnectedOn" id="TextBoxConnectedOn" 
  runat="server" MaxLength="10"/>  
</asp:Content>

Заголовок главной страницы: 

<head runat="server">
  <link type="text/css" href="pages/scripts/themes/ui-darkness/jquery.ui.all.css"
  rel="stylesheet" />
  <script type="text/javascript" src="scripts/jquery-1.4.2.js"></script>
  <script type="text/javascript" src="scripts/ui/jquery.ui.core.min.js"></script> 
  <script type="text/javascript" src="scripts/ui/jquery.ui.datepicker.min.js"></script>
  <asp:ContentPlaceHolder ID="HeadContent" runat="server">
  </asp:ContentPlaceHolder>
</head>

РЕДАКТИРОВАНИЕ
Я изменил "#TextBoxConnectedOn" на "# <% = TextBoxConnectedOn.ClientID%> "и теперь firebug показывает, что он загружает нужные картинки, как только я нажимаю на вход, но все равно не показывает указатель даты.Темой моего вопроса и основным источником разочарования было то, что jquery не выполняется, поэтому я полагаю, что на этот пост дан ответ, спасибо за всю информацию, я посмотрю, смогу ли я выяснить, почему он не отображает

Ответы [ 4 ]

3 голосов
/ 25 июля 2011

В качестве сгенерированного сервером элемента управления id поля ввода фактически не будет TextBoxConnectedOn; ASP.NET сгенерирует id для вас. Проверьте источник страницы в своем браузере, чтобы убедиться в этом.

У вас есть два варианта:

  1. Удалите атрибут runat="server" из элемента управления, чтобы сделать его обычным элементом HTML (действительно ли он должен быть сгенерирован сервером?), Или

  2. Ссылка правильная id

Как это: 

 <script type="text/javascript">
   $(document).ready(function () {
     $("#<%= TextBoxConnectedOn.ClientID %>").datepicker();
   });
 </script>

EDIT

В соответствии с комментарием @jbn ниже, начиная с ASP.NET 4, вы можете указать серверным элементам управления использовать статические идентификаторы, установив для ClientIDMode значение Static.

0 голосов
/ 25 июля 2011

Это потому, что ваша контентная страница меняет идентификатор вашего input type="text".

Два способа преодолеть это.

(a) Присвойте класс типу ввода и вызовите его, используя это. 

<input type="text" name="TextBoxConnectedOn" id="TextBoxConnectedOn" 
  runat="server" MaxLength="10" class="mypicker/>

Теперь назовите это как 

$(document).ready(function () {
  $(".mypicker").datepicker();
});

(b) Сделайте HTMLControl элементом управления ASP.NET и установите ClientIDMode="static" 

<asp:TextBox ID="TextBoxConnectedOn"  runat="server" 
        ClientIDMode="Static"
        Width="240">
</asp:TextBox>

Тогда вам не нужно менять сценарий.

0 голосов
/ 25 июля 2011 
 <script type="text/javascript" src='<%=Url.Content("~/scripts/ui/jquery.ui.core.min.js")%>'></script>

Обычно это происходит из-за того, что файл js не загружается из-за того, как работает маршрутизация.Попробуйте использовать метод Url.Content (), как показано выше.

0 голосов
/ 25 июля 2011

У меня раньше была похожая проблема, когда jQuery загружался на главной странице, а затем и на странице контента, это приводило к тому, что jQuery на странице контента не работал, поэтому проверьте вкладку .net в firebug и убедитесь, что jQuery загружается только один раз.

Надеюсь, это поможет

...