Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.02.2015, 20:53
Новичок на форуме
Отправить личное сообщение для gus_ak Посмотреть профиль Найти все сообщения от gus_ak
 
Регистрация: 04.02.2015
Сообщений: 3

Javascript(JQuery) Проблемы с datapicker.
Ребят помогите пож-та.
Вот страничка:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
  <head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<link type="text/css" href="./css/style.css" rel="stylesheet" > </link>	
	<link href="./css/smoothness/jquery-ui-1.9.1.custom.css" rel="stylesheet"></link>
        <link type="text/css" href="./css/popup.css" rel="stylesheet"> </link>
        <link type="text/css" href="./css/jquery.timepicker.css" rel="stylesheet"> </link>
	<script src="js/addons/jquery-1.8.2.js"></script>
	<script src="js/addons/jquery-ui-1.9.1.custom.js"></script>	
	<script src="js/addons/jquery.ui.datepicker-ru.js"></script>
        <script src="js/addons/jquery.timepicker.js"></script>	
	<script src="js/addons/jquery.cookie.js"></script>
        <script src="js/addons/jquery.json-2.4.js"></script>
	<script src="js/neworder.js"></script>
 </head>
  <!--[if IE 7 ]>    <body class="ie7"> <![endif]-->
  <!--[if IE 8 ]>    <body class="ie8"> <![endif]-->
  <!--[if IE 9 ]>    <body class="ie9"> <![endif]-->
  <!--[if (gt IE 9)|!(IE)]><!--><!--<![endif]-->

  <body>
<div id="ClientInfoDiv">
    <div class="d-col colorblock" style="margin-left: 40px;">
          <div class="f-col" style="width: 170px;">					
              <label>	Оплатить: </label>
              <input type="text"  name="date_1" class="date_1" value=""  id="PaymentDate"></input>
              <div class="date_btn"></div>
          </div>
          <div class="f-col" style="width: 170px;">
              <label>	Выдача заказа: </label>
              <input type="text"  name="date_1" class="date_1" value=""  id="DateEndWork"></input>
              <div  class="date_btn"></div>
          </div>
          <div class="f-col" style="width: 170px;">					
              <label>	Время: </label>
              <input type="text"  name="date_1" class="date_1" value="" id="TimeEndWork"></input>
              <div class="time_btn"></div>
          </div>
      </div>	
</div>	
  </body>
</html>
в js/neworder.js

Код:
$(document).ready(function () {
    $("#DateEndWork").datepicker();
    $("#PaymentDate").datepicker();
    $("#TimeEndWork").timepicker({'timeFormat': 'H:i'});
});
При таком раскладе все прекрасно отрабатывает.
Но стоит мне её грузить динамически через ajax
Код:
$.ajax({
        url: 'orders/neworder.php'
        , type : 'POST'
        , data : PostStr
        , success: function (res) {
            var obj = jQuery.parseJSON(res);
            $("#ClientInfoDiv").empty();
            $("#ClientInfoDiv").append(obj.ClientInfo);
            $("#DateEndWork").datepicker();
            $("#PaymentDate").datepicker();
            $("#TimeEndWork").timepicker({'timeFormat': 'H:i'});
          },
        error: function (res){
            alert('res');
        }
    });
В консоль вылетает ошибка "Uncaught TypeError: undefined is not a function"
на
Код:
 $("#DateEndWork").datepicker();
Понимаю что вопрос чайника...
просто уже мозг себе сломал.. в чем не прав?
Ответить с цитированием
  #2 (permalink)  
Старый 04.02.2015, 21:26
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от gus_ak
$("#DateEndWork").
это есть каким-то чудом в
Сообщение от gus_ak
obj.ClientInfo
Ответить с цитированием
  #3 (permalink)  
Старый 04.02.2015, 21:52
Новичок на форуме
Отправить личное сообщение для gus_ak Посмотреть профиль Найти все сообщения от gus_ak
 
Регистрация: 04.02.2015
Сообщений: 3

Вот этот кусок
<div class="d-col colorblock" style="margin-left: 40px;">
          <div class="f-col" style="width: 170px;">					
              <label>	Оплатить: </label>
              <input type="text"  name="date_1" class="date_1" value=""  id="PaymentDate"></input>
              <div class="date_btn"></div>
          </div>
          <div class="f-col" style="width: 170px;">
              <label>	Выдача заказа: </label>
              <input type="text"  name="date_1" class="date_1" value=""  id="DateEndWork"></input>
              <div  class="date_btn"></div>
          </div>
          <div class="f-col" style="width: 170px;">					
              <label>	Время: </label>
              <input type="text"  name="date_1" class="date_1" value="" id="TimeEndWork"></input>
              <div class="time_btn"></div>
          </div>
      </div>


прилетает из AYAX запроса...его формирует php.
Там еще много Дивов прилетает в json масиве.
После чего я его распихиваю по нужным дивам.
Я просто написал кусок который к делу относится.

а вот на строки
$("#DateEndWork").datepicker();
$("#PaymentDate").datepicker();
$("#TimeEndWork").timepicker({'timeFormat': 'H:i'});

он ругается

я писал в neworder.js
$(document).ready(function () {
     $(".f-sel select").live("click", function () {
        $(this).children("option:selected").attr('selected', 'selected')
        $(this).prev().html("<span>" + $(this).children("option:selected").text() + "</span>");
    });
    $("#DateEndWork").live("click", function(){
        $(this).datepicker();
    });					
    $("#TimeEndWork").live("click", function (){
        $(this).timepicker({ 'timeFormat': 'H:i'})
    });
});


То же по фиг. Говорит что datepicker() такой функции нет.
причем кусок с
$(".f-sel select").live("click", function () {
        $(this).children("option:selected").attr('selected', 'selected')
        $(this).prev().html("<span>" + $(this).children("option:selected").text() + "</span>");
    });

отрабатывает нормально.

Последний раз редактировалось gus_ak, 04.02.2015 в 21:57.
Ответить с цитированием
  #4 (permalink)  
Старый 04.02.2015, 22:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от gus_ak
Вот этот кусок
если он действительно там всё должно работать
<!doctype html>



<html lang="en">

<head>

  <meta charset="utf-8" />

  <title>jQuery UI Datepicker - Default functionality</title>

  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/sunny/jquery-ui.css" />

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

  <link rel="stylesheet" href="/resources/demos/style.css" />
   <style type="text/css">

   body{
     font-size: 12px;
   }
.active .ui-state-default{
    background: rgba(102, 255, 102, 1)
}
.active:hover .ui-state-default{
    background: rgba(255, 255, 0, 1)
}
   </style>
  <script>

  $(function() {

    $.datepicker.regional['ru'] = {
		closeText: 'Закрыть',
		prevText: '&#x3c;Пред',
		nextText: 'След&#x3e;',
		currentText: 'Сегодня',
		monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь', 'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
		monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн', 'Июл','Авг','Сен','Окт','Ноя','Дек'],
		dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
		dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
		dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
		dateFormat: 'dd.mm.yy',
		firstDay: 1,
		isRTL: false,
		showOtherMonths:true,
		selectOtherMonths:true,
		changeMonth:true,
        changeYear: false,
        showAnim:'scale'
};

$.datepicker.setDefaults($.datepicker.regional['ru']);
var obj = {};
obj.ClientInfo = $("#ClientInfoDiv").html();
            $("#ClientInfoDiv").empty();
            alert($("body").html())
            $("#ClientInfoDiv").append(obj.ClientInfo);
            $("#DateEndWork").datepicker();
            $("#PaymentDate").datepicker();
            $("#TimeEndWork").timepicker({'timeFormat': 'H:i'});


  });
  </script>
</head>
<body>
<div id="ClientInfoDiv">
<div class="d-col colorblock" style="margin-left: 40px;">
          <div class="f-col" style="width: 170px;">
              <label>	Оплатить: </label>
              <input type="text"  name="date_1" class="date_1" value=""  id="PaymentDate"></input>
              <div class="date_btn"></div>
          </div>
          <div class="f-col" style="width: 170px;">
              <label>	Выдача заказа: </label>
              <input type="text"  name="date_1" class="date_1" value=""  id="DateEndWork"></input>
              <div  class="date_btn"></div>
          </div>
          <div class="f-col" style="width: 170px;">
              <label>	Время: </label>
              <input type="text"  name="date_1" class="date_1" value="" id="TimeEndWork"></input>
              <div class="time_btn"></div>
          </div>
      </div>
  </div>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 06.02.2015, 12:57
Новичок на форуме
Отправить личное сообщение для gus_ak Посмотреть профиль Найти все сообщения от gus_ak
 
Регистрация: 04.02.2015
Сообщений: 3

Так у меня то же работает...
Но это немного не так как у меня.
изначально есть страница
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
  <head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<link type="text/css" href="./css/style.css" rel="stylesheet" > </link>	
	<link href="./css/smoothness/jquery-ui-1.9.1.custom.css" rel="stylesheet"></link>
        <link type="text/css" href="./css/popup.css" rel="stylesheet"> </link>
        <link type="text/css" href="./css/jquery.timepicker.css" rel="stylesheet"> </link>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/sunny/jquery-ui.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
	<script src="js/addons/jquery.ui.datepicker-ru.js"></script>
        <script src="js/addons/jquery.timepicker.js"></script>	
	<script src="js/addons/jquery.cookie.js"></script>
        <script src="js/addons/jquery.json-2.4.js"></script>
	<script src="js/neworder.js"></script>
	<script src="js/actions.js"></script>
  </head>
  <!--[if IE 7 ]>    <body class="ie7"> <![endif]-->
  <!--[if IE 8 ]>    <body class="ie8"> <![endif]-->
  <!--[if IE 9 ]>    <body class="ie9"> <![endif]-->
  <!--[if (gt IE 9)|!(IE)]><!--><!--<![endif]-->

    <body>
        <div class="wrap clearfix">
            <div class="top"></div>
               <div class="menu">
                <ul class="clearfix">
                    <div id="MainMenu"></div>
                </ul>
            </div>

            <div class="submenu">
                    <ul class="clearfix">
                    <div id="SubMenu">
                            </div>
                    </ul>
            </div>

            <div class="page">
                <div class="content">
                    <div class="content_block">
                        <div class="page_block_top">
                            <div class="head_block"> <div class="open"> Параметры нового заказа </div></div>
                            <div class="f-line clearfix" id="ClientInfoDiv">
                                <div class="select-cont f-col" style="width: 300px;">
                                        <label>
                                            Заказчик
                                        </label>	
                                        <div class="f-col-b">
                                            <input type="text"  name="param6"  class="f_inp_b" id="ClientID" onclick="ShowPopUPClients(this);" value=""></input>		
                                        </div>	
                                </div>
                            </div>
                            <div class="f-line clearfix" id="OrderInfoDiv"></div>
                        </div>
                    </div>
                    <div class="hiddenBlock" id="PopUpWindow"></div>
                    <div id="bg"></div>
                </div><!-- content-->
            </div><!-- page-->
        </div> <!-- wrap-->	
    </body>
</html>


Изначально в ней нет элементов на которые я вешаю datapicker
они прилетают туда в AYAX запросе, их формирует php скрипт
Вот запрос:
$.ajax({
        url: 'orders/neworder.php'
        , type : 'POST'
        , data : PostStr
        , success: function (res) {
            var obj = jQuery.parseJSON(res);
            $("#ClientInfoDiv").empty();
            $("#OrderInfoDiv").empty();
            $("#ClientInfoDiv").append(obj.ClientInfo);
            $("#OrderInfoDiv").append(obj.OrderInfo);
            $("#DateEndWork").datepicker();
            $("#TimeEndWork").timepicker({ 'timeFormat': 'H:i'});
        }    
        , error: function (res){
            alert('res');
        }
    });


так вот, в этом случае, он ругается на строки
$("#DateEndWork").datepicker();
$("#TimeEndWork").timepicker({ 'timeFormat': 'H:i'});

Пробовал делать:
$(document).ready(function () {
     $(".f-sel select").on("click", function () {
        $(this).children("option:selected").attr('selected', 'selected')
        $(this).prev().html("<span>" + $(this).children("option:selected").text() + "</span>");
    });
    $("#DateEndWork").on("click", function(){
        $(this).datepicker();
    });					
    $("#TimeEndWork").on("click", function (){
        $(this).timepicker({ 'timeFormat': 'H:i'})
    });
});

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



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблемы со слайдером. Shupamen Работа 1 15.12.2013 00:12
проблемы с PagingToolbar serg3091 ExtJS 4 26.06.2013 09:33
Datapicker и ошибка "inst is undefined"? bobroff jQuery 0 23.01.2010 22:18
глюк форума Gvozd Сайт Javascript.ru 11 18.03.2009 14:37
Drug&Drop + всплывание события = проблемы =(( _NoName_ Events/DOM/Window 4 05.03.2009 17:47