2013-04-30 2 views
1

Вы можете просмотреть/проверить прямую ссылку на страницу здесь: Search Page HereПоиск в массиве внутри массива в JQuery

У меня есть следующий JQuery:
$ (функция() { $ ('входной [тип = радио] ') нажмите (функция() { вар R_ID = $ ("вход [@ имя = СБН]: проверено").. атр (' ID '); // оповещения (R_ID);

 if (r_id == "bName") { 
      //enable By Name drop down 
      $(".dName").prop('disabled', false); 
      //disable By Specialty and By Status drop down 
      $(".dSpecialty").prop('disabled', true); 
      $(".dStatus").prop('disabled', true); 
     } 
     if (r_id == "bSpecialty") { 
      //enable By Specialty drop down 
      $(".dSpecialty").prop('disabled', false); 
      //disable By Name and By Status drop down 
      $(".dName").prop('disabled', true); 
      $(".dStatus").prop('disabled', true); 
     } 
     if (r_id == "bStatus") { 
      //enable By Status drop down 
      $(".dStatus").prop('disabled', false); 
      //disable By Name and By Specialty drop down 
      $(".dName").prop('disabled', true); 
      $(".dSpecialty").prop('disabled', true); 
     } 
    }); 
    $('.sButton').click(function() { 
     var dNameVal = $(".dName").val(); 
     var dSpecialtyVal = $(".dSpecialty").val(); 
     var dStatusVal = $(".dStatus").val(); 
     if ((dNameVal != "#" && $('.dName').is(':enabled')) || (dSpecialtyVal != "#" && $('.dSpecialty').is(':enabled')) || (dStatusVal != "#" && $('.dStatus').is(':enabled'))) { 
      //alert ("good"); 
      $('.displayresult').css('display','block'); 

      if ($('.dName').is(':enabled')) { 
       document.getElementById('first').innerHTML = phyList[$(".dName").find('option:selected').attr('id')].firstName; 
       document.getElementById('last').innerHTML = phyList[$(".dName").find('option:selected').attr('id')].lastName; 
       document.getElementById('status').innerHTML = phyList[$(".dName").find('option:selected').attr('id')].status; 
       document.getElementById('specialty').innerHTML = phyList[$(".dName").find('option:selected').attr('id')].specialty; 
       document.getElementById('address').innerHTML = phyList[$(".dName").find('option:selected').attr('id')].address; 
       document.getElementById('phone').innerHTML = phyList[$(".dName").find('option:selected').attr('id')].phone; 
      } 
      if ($('.dSpecialty').is(':enabled')) { 
       var fname = ""; 
       var lname = ""; 
       var stats = ""; 
       var spec = ""; 
       var addr = ""; 
       var phonen = ""; 
       for (test=0;test<=phyList.length-1;test++) { 
        i = phyList[test].specialty; //get all specialty in the array 
        //alert(i); //test alert 
        if (i == $(".dSpecialty").find('option:selected').attr('id')) { //if what's in the phyList array matches selection 
         fname = fname + phyList[test].firstName + "<br>"; 
         lname = lname + phyList[test].lastName + "<br>"; 
         stats = stats + phyList[test].status + "<br>"; 
         spec = spec + phyList[test].specialty + "<br>"; 
         addr = addr + phyList[test].address + "<br>"; 
         phonen = phonen + phyList[test].phone + "<br>"; 

         document.getElementById('first').innerHTML = fname; 
         document.getElementById('last').innerHTML = lname; 
         document.getElementById('status').innerHTML = stats; 
         document.getElementById('specialty').innerHTML = spec; 
         document.getElementById('address').innerHTML = addr; 
         document.getElementById('phone').innerHTML = phonen; 
         //alert ("ok"); 
        } 
       } 
      } 
      if ($('.dStatus').is(':enabled')) { 
       var fname = ""; 
       var lname = ""; 
       var stats = ""; 
       var spec = ""; 
       var addr = ""; 
       var phonen = ""; 
       for (test=0;test<=phyList.length-1;test++) { 
        i = phyList[test].status; //get all specialty in the array 
        //alert(i); //test alert 
        if (i == $(".dStatus").find('option:selected').attr('id')) { //if what's in the phyList array matches selection 
         fname = fname + phyList[test].firstName + "<br>"; 
         lname = lname + phyList[test].lastName + "<br>"; 
         stats = stats + phyList[test].status + "<br>"; 
         spec = spec + phyList[test].specialty + "<br>"; 
         addr = addr + phyList[test].address + "<br>"; 
         phonen = phonen + phyList[test].phone + "<br>"; 

         document.getElementById('first').innerHTML = fname; 
         document.getElementById('last').innerHTML = lname; 
         document.getElementById('status').innerHTML = stats; 
         document.getElementById('specialty').innerHTML = spec; 
         document.getElementById('address').innerHTML = addr; 
         document.getElementById('phone').innerHTML = phonen; 
         //alert ("ok"); 
         document.getElementById('errorst').innerHTML = ""; 
        } 
        else { 
         document.getElementById('errorst').innerHTML = "<i>No match found</i>"; 
        } 
       } 
      } 
     } 
     else { 
      alert ("not good"); 
      //display the last successful result search 
     } 
    }); 
}); 

Следующий код HTML:

<table border=0 cellPadding=10 cellSpacing=10> 
    <tr> 
     <td><input type=radio name=sc id=bName class=searchCriteria checked /> By Name:</td> 
     <td> 
      <select class="dName" name="dName"> 
       <option SELECTED value="#" DISABLED>========================</option> 
       <option id="0" value="amensah">Abbey-Mensah, Michael</option> 
       <option id="1" value="acharya">Acharya, Niraj</option> 
       <option id="2" value="achonu">Achonu, Geoffrey C.</option> 
       <option id="3" value="agustin">Agustin, Erie</option> 
       <option id="4" value="agyemang">Agyemang, Kuragu</option> 
       <option id="5" value="jahmed">Ahmed, Jahid</option> 
       <option id="6" value="fahmad">Ahmad, Faqir</option> 
      </select> 
     </td> 
     <td><span id="errorna"></span></td> 
    </tr> 
    <tr> 
     <td><input type=radio name=sc id=bSpecialty class=searchCriteria /> By Specialty:</td> 
     <td> 
      <select class="dSpecialty" name="dSpecialty" DISABLED> 
       <option SELECTED value="#" DISABLED>========================</option> 
       <option id="Anesthesiology" value="Anesthesiology">Anesthesiology</option> 
       <option id="Cardiovascular Disease" value="Cardiovascular Disease">Cardiovascular Disease</option> 
       <option id="Dentistry" value="Dentistry">Dentistry</option> 
       <option id="Dermatology" value="Dermatology">Dermatology</option> 
       <option id="Emergency Medicine" value="Emergency Medicine">Emergency Medicine</option> 
       <option id="Family Practice" value="Family Practice">Family Practice</option> 
       <option id="Gastroenterology" value="Gastroenterology">Gastroenterology</option> 
       <option id="Geriatric Medicine" value="Geriatric Medicine">Geriatric Medicine</option> 
       <option id="Hematology" value="Hematology">Hematology</option> 
       <option id="Internal Medicine" value="Internal Medicine">Internal Medicine</option> 
       <option id="Interventional Cardiology" value="Interventional Cardiology">Interventional Cardiology</option> 
       <option id="Medicine" value="Medicine">Medicine</option> 
       <option id="Obstetrics" value="Obstetrics">Obstetrics</option> 
       <option id="Oral & Maxillofacial Surgery" value="Oral & Maxillofacial Surgery">Oral & Maxillofacial Surgery</option> 
       <option id="Orthopedic Surgery" value="Orthopedic Surgery">Orthopedic Surgery</option> 
       <option id="Otolaryngology" value="Otolaryngology">Otolaryngology</option> 
       <option id="Pathology" value="Pathology">Pathology</option> 
       <option id="Pediatrics" value="Pediatrics">Pediatrics</option> 
       <option id="Physical Medicine & Rehab" value="Physical Medicine & Rehab">Physical Medicine & Rehab</option> 
       <option id="Plastic Surgery" value="Plastic Surgery">Plastic Surgery</option> 
       <option id="Podiatry" value="Podiatry">Podiatry</option> 
       <option id="Psychiatry" value="Psychiatry">Psychiatry</option> 
       <option id="Psychotherapy" value="Psychotherapy">Psychotherapy</option> 
       <option id="Pulmonary Medicine" value="Pulmonary Medicine">Pulmonary Medicine</option> 
       <option id="Rad. Nuclear Medicine" value="Rad. Nuclear Medicine">Rad. Nuclear Medicine</option> 
       <option id="Radiology" value="Radiology">Radiology</option> 
       <option id="Surgery" value="Surgery">Surgery</option> 
       <option id="Urology" value="Urology">Urology</option> 
       <option id="Vascular" value="Vascular">Vascular</option> 
      </select> 
     </td> 
     <td><span id="errorsp"></span></td> 
    </tr> 
    <tr> 
     <td><input type=radio name=sc id=bStatus class=searchCriteria /> By Status:</td> 
     <td> 
      <select class="dStatus" name="dStatus" DISABLED> 
       <option SELECTED value="#" DISABLED>========================</option> 
       <option id="Active" value="active">Active</option> 
       <option id="Allied Health Staff" value="allied">Allied Health Staff</option> 
       <option id="Consulting" value="consulting">Consulting</option> 
       <option id="Courtesy" value="courtesy">Courtesy</option> 
       <option id="Leave of Absence" value="loa">Leave of Absence</option> 
       <option id="Primary Provider" value="primary">Primary Provider</option> 
       <option id="Provisional" value="provisional">Provisional</option> 
      </select> 
     </td> 
     <td><span id="errorst"></span></td> 
    </tr> 
    <tr> 
     <td colSpan=2 align=right><input type=button value="Search" class="sButton" name="sButton" /></td> 
    </tr> 
</table> 

<div class=displayresult> 
    <table border=0 cellPadding=0 cellSpacing=0 width=100%> 
     <tr> 
      <td>First Name</td> 
      <td>Last Name</td> 
      <td>Status</td> 
      <td>Specialty</td> 
      <td>Address</td> 
      <td>Phone Number</td> 
     </tr> 
     <tr> 
      <td class="first" id="first" name="first"></td> 
      <td class="last" id="last" name="last"></td> 
      <td class="status" id="status" name="status"></td> 
      <td class="specialty" id="specialty" name="specialty"></td> 
      <td class="address" id="address" name="address"></td> 
      <td class="phone" id="phone" name="phone"></td> 
     </tr> 
    </table> 
</div> 

Следующий код CSS:

.displayresult { 
    display: none; 
} 

Теперь, если вы проверить код JS, следующий врач имеет несколько специальностей:

... 
{ 
"firstName": "Ahmad", 
"lastName": "Faqir", 
"status": "Provisional", 
"specialty": ["Internal Medicine", "Pediatrics"], 
"address": "test test, Brooklyn NY 11218", 
"phone": "456.673.4389" 
} 
... 

Как изменить функцию JQuery, чтобы гарантировать, что он показывает для обоих вариантов, когда пользователь выбирает «Внутренняя медицина» ИЛИ «Педиатрия» в качестве специальности?

Также следующие JS не работает:

... 
       if (i == $(".dStatus").find('option:selected').attr('id')) { //if what's in the phyList array matches selection 
        fname = fname + phyList[test].firstName + "<br>"; 
        lname = lname + phyList[test].lastName + "<br>"; 
        stats = stats + phyList[test].status + "<br>"; 
        spec = spec + phyList[test].specialty + "<br>"; 
        addr = addr + phyList[test].address + "<br>"; 
        phonen = phonen + phyList[test].phone + "<br>"; 

        document.getElementById('first').innerHTML = fname; 
        document.getElementById('last').innerHTML = lname; 
        document.getElementById('status').innerHTML = stats; 
        document.getElementById('specialty').innerHTML = spec; 
        document.getElementById('address').innerHTML = addr; 
        document.getElementById('phone').innerHTML = phonen; 
        //alert ("ok"); 
        document.getElementById('errorst').innerHTML = ""; 
       } 
       else { 
        document.getElementById('errorst').innerHTML = "<i>No match found</i>"; 
       } 
      } 
... 

Он всегда отображает не найдено сообщение независимо от того, будет ли найдено соответствие или нет.

Как это сделать, так отображается только сообщение, если совпадение не найдено?

+1

Что такое 'if' выражение в последнем блоке кода? Он был отрезан. –

+1

_Also следующий JQuery не работает: _ это не jQuery, а исходный JS. –

+0

@RickViscomi Это было частью исходного кода и не хотелось его расширять. Но по вашему запросу я добавил его сейчас. – Si8

ответ

1

Причина, по которой у вас может возникнуть проблема, заключается в том, что вы никогда не объявляете i. Ваш для цикла должен начинаться так:

for (test=0;test<=phyList.length-1;test++) { 
    var i = phyList[test].specialty; //get all specialty in the array 

Это будет давать вам множество, если есть несколько специальностей, так что вы должны использовать второй цикл, чтобы пройти через ваши блюда.

for (var iVar; iVar < i.length; iVar++) 
{ 
    if (i[iVar] == $(".dStatus").find('option:selected').attr('id')) { //if what's in the phyList array matches selection 
     //code 
    } 
} 

Это должно проверить все специальности каждого врача.

Поскольку не все блюда добавляются в виде массивов, вам нужно включить исходный оператор if вне цикла for. Вот рабочий jQuery: http://jsfiddle.net/k7jhq/

+0

Должен ли я добавить еще один FOR LOOP под «i»? Можно ли показать мне пример? Тем временем я попытаюсь отредактировать мое. Благодарю. – Si8

+0

Я только пытаюсь напечатать строку один раз.Итак, если педиатрия выбрана, я бы хотел, чтобы имя врача было перечислено один раз. – Si8

+0

Я попробовал добавить свой код, но он не сработал:/ – Si8

1

Просто упрощенный пример того, что вы можете сделать, используя .map(), чтобы найти нужные объекты.

// value of dropdown 
var spe = $('#test').val(); 

var matchedPhy = $.map(phyList, function (v, i) { 
    // return object if string matches or string is in array 
    return v.specialty == spe || $.inArray(spe,v.specialty) > -1 ? v: null; 
}); 

if(matchedPhy.length){ 
    // found some results 
}else{ 
    // found no results 
} 

http://jsfiddle.net/AVU5N/

+0

это выглядит БОЛЬШИМ, и именно то, что я хочу, чтобы он это сделал ... Но для третьего врача я могу просто показать «педиатрическую», а не обе специальности? И как бы я включил его здесь: jsfiddle.net/5mBvq – Si8

+1

Вы можете показать все, что захотите. Я просто зациклился, чтобы показать ключ/значения объекта .. но вы можете настроить их все, чтобы отобразить то, что вы хотите. –

+1

@ SiKni8 вот пример того, как вы можете управлять выходом [FIDDLE] (http://jsfiddle.net/RXe9X/) –

Смежные вопросы