2013-06-12 3 views
0

У меня есть две вещей первым является выпадающем DropDownBox'й, что когда-то пользователь выбирает его параметры будут вызывать яваскрипт код и показать результаты на ту же странице,Моя Javascript функция не перенаправляет на другую страницу

второй является поле ввода и кнопку поиска, как только пользователь что-то вводит и нажимает кнопку поиска, он запускает javascript, но по некоторым причинам он добавляет значение к текущему адресу страницы, а не перенаправляет на другую страницу, а xmlhttp.status возвращает 0.

Вместо перенаправления на класс/myresults.php он добавляет item1 и его значение к текущему адресу страницы, который является www.myexample.com/index.php?item1=computer

Моей форма, которая не работает

<form action=""> 
       <input name="search" type="text" title="Search"/> 
       <input type="submit" value="search" onclick="finditem(this.form.search.value)"/> 
</form> 


function finditem(option){ 
    alert(option); <<<<shows the correct entered value 
    if (window.XMLHttpRequest) 
     { 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     { 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 
      alert(xmlhttp.status); << returns 0 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       document.getElementById("Result").innerHTML=xmlhttp.responseText; 
      } 
     } 
     xmlhttp.open("GET","class/myresults.php?item1="+option,true); 
     xmlhttp.send(); 
    } 

Java скрипт из выпадающего списка , который работает

<select name="items" onchange="findbox(this.value)"> 
    ..... 
    </select> 

function findbox(option){ 
      if (window.XMLHttpRequest) 
       { 
        xmlhttp=new XMLHttpRequest(); 
       } 
       else 
       { 
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
       } 
       xmlhttp.onreadystatechange=function() 
       { 
        if (xmlhttp.readyState==4 && xmlhttp.status==200) 
        { 
         document.getElementById("Result").innerHTML=xmlhttp.responseText; 
        } 
       } 
       xmlhttp.open("GET","class/myresults.php?item2="+option,true); 
       xmlhttp.send(); 

      } 
+0

Это выглядит полезным - посмотрите на верхний ответ http://stackoverflow.com/questions/4048406/javascript-select-drop-down-menu-onchange-not-firing-properly т.е. послать выберите себя и получить параметр в javascript, используя 'var criteria1 = crit1.options [crit1.selectedIndex] .value;' (с вашими правильными именами переменных) –

ответ

2

Ваша форма получает представлены, то есть сообщения браузерных данных в то же самое где он нашел вашу страницу. Кажется, вы этого не хотите. Поэтому вам следует предотвратить подачу формы. Для достижения этой цели, вы не должны слушать onclick события кнопки, но на onsubmit событие формы:

<form action="" onsubmit="return finditem(this.search.value)"> 
       <input name="search" type="text" title="Search"/> 
       <input type="submit" value="search"/> 
</form> 

И вот JavaScript: (Обратите внимание, что finditem возвращает ложное, чтобы предотвратить форму от фактического представления.)

function finditem(option){ 
    if (window.XMLHttpRequest) 
     { 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     { 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       document.getElementById("Result").innerHTML=xmlhttp.responseText; 
      } 
     } 
     xmlhttp.open("GET","class/myresults.php?item1="+option,true); 
     xmlhttp.send(); 

     return false; 
    } 
Смежные вопросы