2010-07-01 4 views
0

http://www.ama3.com/anytime/jQuery - initialisation en direct de AnyTime Picker sur l'élément annexe

$(".pick_date").AnyTime_picker({ format: "%W, %M %D, %z" }); 

Ceci est du code pour initialiser sélecteur de AnyTime sur l'élément .pick_date. Mais si j'ajoute un élément, AnyTime ne fonctionne pas. Y a-t-il un moyen de le faire fonctionner?

J'ai essayé ceci:

$('#submit-buton').live("click", function() { 

    $.ajax({ 
     type: "POST", 
     url: '/AddTask', 
     dataType: 'html', 
     success: function(data) { 
      $("#taskModule").append(data);    

      $(".pick_date").AnyTime_picker({ format: "%W, %M %D, %z" }); 
     } 
    }); 

}); 

Mais aucun effet ...

Toute idée?

EDIT:

Cela fonctionne:

<div id="mydatepicker"> 
</div> 

<input type="button" id="MyButton" value="Append" /> 

<script type="text/javascript"> 

    $(function() { 

     var mydatepickerHtml = 'English: <input type="text" id="field1" size="50" value="Sunday, July 30th in the Year 1967 CE" /><br/>Español: <input type="text" id="field2" value="12:34" />'; 
     $("#mydatepicker").append(mydatepickerHtml); 

     $('#MyButton').live("click", function() {    
      // ... 
     }); 

     AnyTime.picker("field1",  { format: "%W, %M %D in the Year %z %E", firstDOW: 1 }); 
      $("#field2").AnyTime_picker( 
       { format: "%H:%i", labelTitle: "Hora", 
       labelHour: "Hora", labelMinute: "Minuto" }); 

    }); 
</script> 

Mais cela ne ...

<div id="mydatepicker"> 
</div> 

<input type="button" id="MyButton" value="Append" /> 

<script type="text/javascript"> 

    $(function() { 
     $('#MyButton').live("click", function() { 
      var mydatepickerHtml = 'English: <input type="text" id="field1" size="50" value="Sunday, July 30th in the Year 1967 CE" /><br/>Español: <input type="text" id="field2" value="12:34" />'; 
      $("#mydatepicker").append(mydatepickerHtml); 
     }); 

     AnyTime.picker("field1",  { format: "%W, %M %D in the Year %z %E", firstDOW: 1 }); 
      $("#field2").AnyTime_picker( 
       { format: "%H:%i", labelTitle: "Hora", 
       labelHour: "Hora", labelMinute: "Minuto" }); 
    }); 
</script> 
+1

'# submit-buton' n'est pas une faute de frappe? juste au cas où ... – jAndy

+0

non :) ... tout fonctionne bien sauf l'initialisation –

+0

On dirait que le problème avec ce code est que vous créez l'entrée sur l'événement click mais que vous créez le sélecteur en dehors du gestionnaire d'événements. Cela signifierait que vous essayez de créer le sélecteur avant l'entrée existe (l'entrée doit être sur la page avant d'essayer de créer le sélecteur pour cela!). Voir mon autre réponse pour plus d'aide (je suis l'auteur de AnyTime.picker donc votre meilleur pari est de venir directement à moi pour de l'aide!) –

Répondre

2

EDIT:

Cela fonctionne.

<div id="mydatepicker"> 
</div> 

<input type="button" id="MyButton" value="Append" /> 

<script type="text/javascript"> 

    $(function() { 
     $('#MyButton').live("click", function() { 
      var mydatepickerHtml = 'English: <input type="text" id="field1" size="50" value="Sunday, July 30th in the Year 1967 CE" /><br/>Español: <input type="text" id="field2" value="12:34" />'; 
      $("#mydatepicker").append(mydatepickerHtml); 

      AnyTime.picker("field1",  { format: "%W, %M %D in the Year %z %E", firstDOW: 1 }); 
      $("#field2").AnyTime_picker( 
       { format: "%H:%i", labelTitle: "Hora", 
       labelHour: "Hora", labelMinute: "Minuto" }); 
     }); 


    }); 
</script> 

J'ai essayé ce plugin dans la page échantillon sur html jointe en annexe. Ça marche.

Je pense que vous devriez vérifier le html data retourné sur demande ajax. Contient-il l'élément pick_date?

Vous pouvez également vérifier le $(".pick_date").length pour vérifier que vous obtenez l'élément.

Commander mon échantillon.

<html> 
<head> 

<link rel="stylesheet" type="text/css" href="anytimec.css" /> 
<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.js" type="text/javascript"></script>       
<script type="text/javascript" src="anytimec.js"></script> 

</head> 
<body> 
<div id="mydatepicker"> 
</div> 

<script type="text/javascript"> 

var mydatepickerHtml = 'English: <input type="text" id="field1" size="50" value="Sunday, July 30th in the Year 1967 CE" /><br/>Español: <input type="text" id="field2" value="12:34" />'; 

$(function() 
{ 
$("#mydatepicker").append(mydatepickerHtml); 

AnyTime.picker("field1",  { format: "%W, %M %D in the Year %z %E", firstDOW: 1 }); 
    $("#field2").AnyTime_picker( 
     { format: "%H:%i", labelTitle: "Hora", 
     labelHour: "Hora", labelMinute: "Minuto" }); 

}); 

</script> 
</body> 
</html> 
+0

S'il vous plaît, vérifiez ma question éditée. J'ai essayé ce que tu as suggéré mais ton exemple n'est pas bon. –

+0

@ile - checkout ma réponse mise à jour. – Krunal

+0

J'ai trouvé où je me trompais. J'ai aussi essayé ce que vous avez suggéré, mais il semble que je doive utiliser l'id pour l'initialisation, pas la classe. AnyTime.picker ("field1", {format: "% W,% M% D dans l'année% z% E", firstDOW: 1}); - c'est bien, mais $ (". date_picker") AnyTime.picker ({format: "% W,% M% D dans l'année% z% E", firstDOW: 1}); ne fonctionnera pas sur les éléments ajoutés. –

0

$.AnyTime_picker() devrait fonctionner sur les classes ainsi que les éléments ajoutés. S'il vous plaît poster l'URL ici où je peux déboguer le problème, ou envoyez-moi un message via http://www.ama3.com/doorkeeper/ et je vais mettre votre adresse e-mail en liste blanche, de sorte que vous pouvez m'envoyer les fichiers HTML/CSS/JS et je peux tenter de reproduire le problème ordinateur. Merci!

+0

Salut Andrew Je l'utilise dans le contrôle asp.net dans un panneau de mise à jour. et j'obtiens l'erreur "Erreur: exception non interceptée: Impossible de créer un autre AnyTime.sélecteur pour "ctl00_cphDashBoard_tabContainOwners_TabPanel2_txtCalender" ", qui je pense à cause du panneau de mise à jour – Raghurocks

+0

erreur persiste seulement si je vais à code derrière sur la sélection de la date – Raghurocks