après avoir inséré un script le signe dollar renvoie null

Question

javascript newbie ici, j'ai écrit un formulaire en html et l'ai soumis avec un événement onchange, mais après avoir ajouté un sélecteur daterange en javascript, la soumission ne fonctionne pas. Voici mon code:

<form id="dash_form" method="get"> 
     <div>Select a Tag Bundle dimension:</div> 
     <select name="dimension" id="id_dimension" onchange="$('form#dash_form').submit()"> 
      <option value="">No dimension </option> 
      <option value="Hello">Hello</option> 
     </select> 
     <h4>Please select a date range below:</h4> 
     <div id="calendars"></div> 
     <span> 
     <input type="text" name="from" value="" id="start"/> 
     &ndash; 
     <input type="text" name="to" value="" id="end"/> 
     </span> 
    </form> 
    <script type="text/javascript" charset="utf-8" src="/site_media/crm/javascripts/prototype.js"></script> 
    <script type="text/javascript" charset="utf-8" src="/site_media/crm/javascripts/timeframe.js"></script> 
    <script type="text/javascript" charset="utf-8"> 
     //<![CDATA[ 
     new Timeframe('calendars', { 
      startField: 'from', 
      endField: 'to', 
      latest: Date.parseToObject({{Now}}), 
      resetButton: 'reset' }); 
     //]]> 
    </script> 

à Firebug je reçois $("form#dash_form") is null, et quand je supprime les lignes de script, il travaille ... que peut-être la cause?

Answer 1

Vous semblez avoir ajouté la bibliothèque prototypejs à votre projet.

À la fois prototypejs et jQuery utilisent l'identificateur global , donc quand vous avez les deux, ils s'affrontent.

Soit choisir une bibliothèque ou l'autre (préférable à mon avis), ou prend des mesures pour résoudre le conflit:

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Answer 2

Il s'agit probablement d'un conflit entre prototype et jquery car les deux utilisent la fonction $. Il y a noConflict pour gérer cette situation. Aussi au lieu de mélanger le balisage et javascript définissent le onchange de la sélection discrètement:

$(function() { 
    $('select#id_dimension').change(function() { 
     $('form#dash_form').submit(); 
    }); 
});