UI Jquery Datepicker sur une image

Question

Salutations,

Je veux faire apparaître la Jquery Datepick que l'image est cliqué et l'affichage à côté de lui. Une fois qu'une date est cliquée, je veux poster mon formulaire.

Voici comment j'essaie ceci:

Le code HTML:

<form id="myform"> 
<span class="quickgo"> 
Quick Go: 
<select> 
<option value="1">Discovery Channel</option> 
<option value="2">History Channel</option> 
</select> 
<img class="calenderpick" src="/img/calender.png" /> 
</form> 

Et la partie javascript:

<script type="text/javascript"> 
$(function() { 
    $(".calenderpick").click(function() { 
     $(this).datepicker(); 
     alert("it is clicked!"); 
    });   
}); 
</script> 

Une fois que cette image est cliqué, je peux obtenir le « il est cliqué avertissement "mais pas le sélecteur de date. Je n'ai pas non plus la moindre idée sur la façon de déclencher l'événement de publication de formulaire une fois qu'une date est choisie. En fin de compte, je veux poster la chaîne sélectionnée et la date choisie afin que je puisse changer de page.

Merci

Answer 1

Hellnar,

Voici ce que je l'utilise régulièrement dans mes applications mvc:

<input class="date" id="StartDate" name="StartDate" value="" type="hidden" /> 

<script type="text/javascript"> 
    $(document).ready(function() { 
    $("#StartDate").datepicker({ 
      dateFormat: 'dd-mm-yy', 
      changeMonth: true, 
      changeYear: true, 
      showOn: 'button', 
      buttonImage: '/img/calender.png' 
     }); 
    }); 
</script> 

espérons que cela aide (notez que j'utilise un identifiant et non un sélecteur de classe). En outre, vérifiez l'orthographe sur calendrier - devraient être CALEnd un r :)

modifier - si vous voulez soumettre le formulaire à la sélection de la date, modifiez le code javascript pour:

<script type="text/javascript"> 
    $(document).ready(function() { 
    $("#StartDate").datepicker({ 
      dateFormat: 'dd-mm-yy', 
      changeMonth: true, 
      changeYear: true, 
      showOn: 'button', 
      buttonImage: '/img/calender.png', 
      onSelect: function(dateText, inst) { $("#myform").submit(); } 
     }); 
    }); 
</script> 

Answer 2

• Pourquoi son ne pas ouvrir sur en cliquant sur l'image

Regardez dans la source ici JQuery Datepicker Icon Trigger

• Comment publier le formulaire sur la sélection d'une date

Lo ok dans la source ici JQuery Datepicker Events - onSelect

en cas onSelect vous pouvez faire quelque chose comme $("#form").submit()

Hope this helps