As popular select with 2 json parameters

Question

I’m making a form, and I didn’t find anything like it in the research I did.

I have the code http://jsfiddle.net/rubensoul/xdmz35oy/3/ I’m getting popular them normally,

When selecting a date he populates the region, popular the region populates a professional, and popular the professional, he populates the time.

However, I need to select a 'complementary exam type' checkbox, it brings professional JSON information and also checkbox information to the time select. What I need is to create an array that has both professional and checkbox ids on time.

i need then, that the 2 parameters (professional and (type of exam) were sent to the same array, and return to select (schedules) I am using a switch case of json

I have to pass the checkbox parameter and it interact with the professional array, and update the schedule, that’s basically it

 <?php 

 header('Content-type: text/json'); $retorno = array();

 switch($_POST['profissional']) {    case '21': // 
       $retorno = array(         0 => "Selecione um horário",  
         41 => "18h30",

       );
       break;    case '24': // 
       $retorno = array(         0 => "Selecione um horário",  
          42 => "18h50",

       );
       break;

    case '27': // 
       $retorno = array(         0 => "Selecione um horário",   
          43 => "20h30",

       );
       break;    case '30': // 
       $retorno = array(         0 => "Selecione um horário",   
          44 => "20h00",

       );
       break;
         case '33': // 
       $retorno = array(         0 => "Selecione um horário",     
          45 => "22h45",

       );
       break;

             case '35': // 
       $retorno = array(         0 => "Selecione um horário",   
          46 => "22h00",

       );
       break; }


 echo json_encode($retorno);

 ?>

// call to checkbox

<?php 

header('Content-type: text/json');
$retorno = array();

switch($_POST['inlineCheckbox1'])
{
   case 'option1': // regiao 1
      $retorno = array(
         0 => "Selecione um horário (checkbox)",  
         91 => "18h30",
         95 => "19h30",

      );
      break;
   case 'option2': // regiao 2
      $retorno = array(
         0 => "Selecione um horário (checkbox)",  
         92 => "18h50",
         99 => "22h50",


      );
      break;

   case 'option3': // regiao 2
      $retorno = array(
         0 => "Selecione um horário (checkbox)",   
         93 => "20h30",
         97 => "22h30",

      );
      break;

}


echo json_encode($retorno);

?>

How can I make this change in the array to receive the 2 parameters?

Can anyone help me? Thanks in advance.

Answer 1

To send to javascript using more than one value use:

data: {regiao: $("#regiao").val(),
profissional: $("#profissional").val()}

Javascript will then send the two values at the same time to the requested page. Unable to use ajax to send to two pages at the same time.

I also recommend using only one $(Document). ready() and put all the contents together, so code would be more readable too:

$(document).ready(function(){
$('#regiao').bind('change', function(){
$.ajax({
 type: "POST",
     url: "teste2.php",
     data: {regiao: $("#regiao").val()},
     dataType: "json",
     success: function(json){
        var options = "";
        $.each(json, function(key, value){
           options += '<option value="' + key + '">' + value + '</option>';
        });
        $("#profissional").html(options);
     }
   });
 });
// AQUI É O CHECKBOX

$('#inlineCheckbox1').on('click', function() {
  $.ajax({
     type: "POST",
     url: "teste4.php",
     data: {inlineCheckbox1: $("#inlineCheckbox1").val()},
     dataType: "json",
     success: function(json){
        var options = "";
        $.each(json, function(key, value){
           options += '<option value="' + key + '">' + value + '</option>';
        });
        $("#horarios").html(options);
     }
  });
});

// AQUI É O PROFISSIONAL

 $('#profissional').bind('change', function(){
  $.ajax({
     type: "POST",
     url: "teste3.php",
     data: {profissional: $("#profissional").val()},
     dataType: "json",
     success: function(json){
        var options = "";
        $.each(json, function(key, value){
           options += '<option value="' + key + '">' + value + '</option>';
        });
        $("#horarios").html(options);
     }
     });
   });
});

Reply to the comment:

Yes, you can intercept in javascript the selected values before sending to ajax in several ways. One trick you can use is to modify the name tag of all checkboxes to option and their values to 1 and 2 and 3. modify their id to Clin, derm and Odont. So you can send only the following to jquery:

data: {regiao: $("#regiao").val(),
    profissional: $("#profissional").val(),
    tipo: [ $("#clin").val(), $("#derm ").val(), $("#odont").val()]
}

Then you’ll need to split the type in php.

or

data: {regiao: $("#regiao").val(),
    profissional: $("#profissional").val(),
    clin: $("#clin")[0].checked?$("#clin").val():'',
    derm: $("#derm")[0].checked?$("#derm").val():'',
    odont: $("#odont")[0].checked?$("#odont").val():''
 }

Then you will have a variable for each checkbox