Depending Dropdown from Multi Select Codeigniter












0















I have Customer Textfield, that contains customer Name. And then, i also have Project Textfield contains project name from customer. I want to make depending dropdown from multi select customer.
For example, user select : btel, celc, from the Customer Textfield, it just appear in Project Text field from btel and celc.
This is my JS:



<script type="text/javascript">
$('.filter_user_customer').select2();
$(document).ready(function(){
$('input[name="daterange"]').daterangepicker({
opens: 'left',
drops: 'up'
}, function(start, end, label) {
console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
});
// key category select box
var $category = $('select#categoryField');
// customer select box
var $customer = $('select#customerField');
// project select box
var $projects = $('select#projectField');
// on change user role, get projects
var $role = $('select#roleField');
// on change user id, get projects
var $userid = $('select#useridField');
// on change combiner
var $combiner = $('combinerField');

$customer.on('change', function () {
// get selected customer name
var customer = $(this).find('option:selected').val();
console.log(customer);
// post data with CSRF token
var data = {
action:'project',
customer: customer,
"<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
};
// AjaxPOST to get projects
$.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
projects_data = '<option value="0">All</option>';
$.each(json, function(index, obj){
projects_data += '<option value="'+obj.project_id+'">'+obj.project_id+'</option>';
});
// append all projects in project dropdown
$projects.html(projects_data);
}, 'JSON');
});

// on change user role, get project
$projects.on('change', function () {
// get selected project name
var project = $(this).find('option:selected').val();
// AjaxPOSt wit CSRF
var data = {
action:'role',
project: project,
"<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
};
$.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
role_data = '<option value="0">All</option>';
$.each(json, function(index, obj){
role_data += '<option value="'+obj.user_owner+'">'+obj.user_owner+'</option>';
});
// append all role data in Role dropdown
$role.html(role_data);
}, 'JSON');
});

// on change user ID, get project
$projects.on('change', function () {
// get selected project name
var project = $(this).find('option:selected').val();
// AjaxPOSt wit CSRF
var data = {
action:'userid',
project: project,
"<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
};
$.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
userid_data = '<option value="0">All</option>';
$.each(json, function(index, obj){
userid_data += '<option value="'+obj.user_id+'">'+obj.user_id+'</option>';
});
// append all role data in Role dropdown
$userid.html(userid_data);
}, 'JSON');
});
});

</script>


This is my Controller:



$array_data = array();
// only on Ajax Request
if ($this->input->is_ajax_request()) {
// if request for projects
if ($this->input->post('action') && $this->input->post('action') == 'project') {
// get customer name
$customer = $this->input->post('customer', true);
// get project data by customer name
$array_data = $this->ixt_models->fetch_project(trim($customer), 'project');
// AjaxPOST JSON response
echo json_encode($array_data);die();
}


This is my Model:



public function fetch_project($where_data = null, $type = null)
{
$query = '';

// customer only
if (is_null($type) && is_null($where_data)) {
// desire column from table
$this->db->select('cust_id');
// only unique customer
$this->db->distinct('cust_id');
// mysql table
$query = $this->db->get($this->table_helper);
}

// projects by customer
elseif ($type == 'project' && !is_null($where_data)) {
// desire column from table
$this->db->select('project_id');
// where clause
$this->db->where('cust_id', $where_data);
// mysql table
$query = $this->db->get($this->table_helper);
}


Right now, Project Textfield only show one choice when Customer take more than one selection :
Click here










share|improve this question



























    0















    I have Customer Textfield, that contains customer Name. And then, i also have Project Textfield contains project name from customer. I want to make depending dropdown from multi select customer.
    For example, user select : btel, celc, from the Customer Textfield, it just appear in Project Text field from btel and celc.
    This is my JS:



    <script type="text/javascript">
    $('.filter_user_customer').select2();
    $(document).ready(function(){
    $('input[name="daterange"]').daterangepicker({
    opens: 'left',
    drops: 'up'
    }, function(start, end, label) {
    console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
    });
    // key category select box
    var $category = $('select#categoryField');
    // customer select box
    var $customer = $('select#customerField');
    // project select box
    var $projects = $('select#projectField');
    // on change user role, get projects
    var $role = $('select#roleField');
    // on change user id, get projects
    var $userid = $('select#useridField');
    // on change combiner
    var $combiner = $('combinerField');

    $customer.on('change', function () {
    // get selected customer name
    var customer = $(this).find('option:selected').val();
    console.log(customer);
    // post data with CSRF token
    var data = {
    action:'project',
    customer: customer,
    "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
    };
    // AjaxPOST to get projects
    $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
    projects_data = '<option value="0">All</option>';
    $.each(json, function(index, obj){
    projects_data += '<option value="'+obj.project_id+'">'+obj.project_id+'</option>';
    });
    // append all projects in project dropdown
    $projects.html(projects_data);
    }, 'JSON');
    });

    // on change user role, get project
    $projects.on('change', function () {
    // get selected project name
    var project = $(this).find('option:selected').val();
    // AjaxPOSt wit CSRF
    var data = {
    action:'role',
    project: project,
    "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
    };
    $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
    role_data = '<option value="0">All</option>';
    $.each(json, function(index, obj){
    role_data += '<option value="'+obj.user_owner+'">'+obj.user_owner+'</option>';
    });
    // append all role data in Role dropdown
    $role.html(role_data);
    }, 'JSON');
    });

    // on change user ID, get project
    $projects.on('change', function () {
    // get selected project name
    var project = $(this).find('option:selected').val();
    // AjaxPOSt wit CSRF
    var data = {
    action:'userid',
    project: project,
    "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
    };
    $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
    userid_data = '<option value="0">All</option>';
    $.each(json, function(index, obj){
    userid_data += '<option value="'+obj.user_id+'">'+obj.user_id+'</option>';
    });
    // append all role data in Role dropdown
    $userid.html(userid_data);
    }, 'JSON');
    });
    });

    </script>


    This is my Controller:



    $array_data = array();
    // only on Ajax Request
    if ($this->input->is_ajax_request()) {
    // if request for projects
    if ($this->input->post('action') && $this->input->post('action') == 'project') {
    // get customer name
    $customer = $this->input->post('customer', true);
    // get project data by customer name
    $array_data = $this->ixt_models->fetch_project(trim($customer), 'project');
    // AjaxPOST JSON response
    echo json_encode($array_data);die();
    }


    This is my Model:



    public function fetch_project($where_data = null, $type = null)
    {
    $query = '';

    // customer only
    if (is_null($type) && is_null($where_data)) {
    // desire column from table
    $this->db->select('cust_id');
    // only unique customer
    $this->db->distinct('cust_id');
    // mysql table
    $query = $this->db->get($this->table_helper);
    }

    // projects by customer
    elseif ($type == 'project' && !is_null($where_data)) {
    // desire column from table
    $this->db->select('project_id');
    // where clause
    $this->db->where('cust_id', $where_data);
    // mysql table
    $query = $this->db->get($this->table_helper);
    }


    Right now, Project Textfield only show one choice when Customer take more than one selection :
    Click here










    share|improve this question

























      0












      0








      0








      I have Customer Textfield, that contains customer Name. And then, i also have Project Textfield contains project name from customer. I want to make depending dropdown from multi select customer.
      For example, user select : btel, celc, from the Customer Textfield, it just appear in Project Text field from btel and celc.
      This is my JS:



      <script type="text/javascript">
      $('.filter_user_customer').select2();
      $(document).ready(function(){
      $('input[name="daterange"]').daterangepicker({
      opens: 'left',
      drops: 'up'
      }, function(start, end, label) {
      console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
      });
      // key category select box
      var $category = $('select#categoryField');
      // customer select box
      var $customer = $('select#customerField');
      // project select box
      var $projects = $('select#projectField');
      // on change user role, get projects
      var $role = $('select#roleField');
      // on change user id, get projects
      var $userid = $('select#useridField');
      // on change combiner
      var $combiner = $('combinerField');

      $customer.on('change', function () {
      // get selected customer name
      var customer = $(this).find('option:selected').val();
      console.log(customer);
      // post data with CSRF token
      var data = {
      action:'project',
      customer: customer,
      "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
      };
      // AjaxPOST to get projects
      $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
      projects_data = '<option value="0">All</option>';
      $.each(json, function(index, obj){
      projects_data += '<option value="'+obj.project_id+'">'+obj.project_id+'</option>';
      });
      // append all projects in project dropdown
      $projects.html(projects_data);
      }, 'JSON');
      });

      // on change user role, get project
      $projects.on('change', function () {
      // get selected project name
      var project = $(this).find('option:selected').val();
      // AjaxPOSt wit CSRF
      var data = {
      action:'role',
      project: project,
      "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
      };
      $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
      role_data = '<option value="0">All</option>';
      $.each(json, function(index, obj){
      role_data += '<option value="'+obj.user_owner+'">'+obj.user_owner+'</option>';
      });
      // append all role data in Role dropdown
      $role.html(role_data);
      }, 'JSON');
      });

      // on change user ID, get project
      $projects.on('change', function () {
      // get selected project name
      var project = $(this).find('option:selected').val();
      // AjaxPOSt wit CSRF
      var data = {
      action:'userid',
      project: project,
      "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
      };
      $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
      userid_data = '<option value="0">All</option>';
      $.each(json, function(index, obj){
      userid_data += '<option value="'+obj.user_id+'">'+obj.user_id+'</option>';
      });
      // append all role data in Role dropdown
      $userid.html(userid_data);
      }, 'JSON');
      });
      });

      </script>


      This is my Controller:



      $array_data = array();
      // only on Ajax Request
      if ($this->input->is_ajax_request()) {
      // if request for projects
      if ($this->input->post('action') && $this->input->post('action') == 'project') {
      // get customer name
      $customer = $this->input->post('customer', true);
      // get project data by customer name
      $array_data = $this->ixt_models->fetch_project(trim($customer), 'project');
      // AjaxPOST JSON response
      echo json_encode($array_data);die();
      }


      This is my Model:



      public function fetch_project($where_data = null, $type = null)
      {
      $query = '';

      // customer only
      if (is_null($type) && is_null($where_data)) {
      // desire column from table
      $this->db->select('cust_id');
      // only unique customer
      $this->db->distinct('cust_id');
      // mysql table
      $query = $this->db->get($this->table_helper);
      }

      // projects by customer
      elseif ($type == 'project' && !is_null($where_data)) {
      // desire column from table
      $this->db->select('project_id');
      // where clause
      $this->db->where('cust_id', $where_data);
      // mysql table
      $query = $this->db->get($this->table_helper);
      }


      Right now, Project Textfield only show one choice when Customer take more than one selection :
      Click here










      share|improve this question














      I have Customer Textfield, that contains customer Name. And then, i also have Project Textfield contains project name from customer. I want to make depending dropdown from multi select customer.
      For example, user select : btel, celc, from the Customer Textfield, it just appear in Project Text field from btel and celc.
      This is my JS:



      <script type="text/javascript">
      $('.filter_user_customer').select2();
      $(document).ready(function(){
      $('input[name="daterange"]').daterangepicker({
      opens: 'left',
      drops: 'up'
      }, function(start, end, label) {
      console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
      });
      // key category select box
      var $category = $('select#categoryField');
      // customer select box
      var $customer = $('select#customerField');
      // project select box
      var $projects = $('select#projectField');
      // on change user role, get projects
      var $role = $('select#roleField');
      // on change user id, get projects
      var $userid = $('select#useridField');
      // on change combiner
      var $combiner = $('combinerField');

      $customer.on('change', function () {
      // get selected customer name
      var customer = $(this).find('option:selected').val();
      console.log(customer);
      // post data with CSRF token
      var data = {
      action:'project',
      customer: customer,
      "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
      };
      // AjaxPOST to get projects
      $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
      projects_data = '<option value="0">All</option>';
      $.each(json, function(index, obj){
      projects_data += '<option value="'+obj.project_id+'">'+obj.project_id+'</option>';
      });
      // append all projects in project dropdown
      $projects.html(projects_data);
      }, 'JSON');
      });

      // on change user role, get project
      $projects.on('change', function () {
      // get selected project name
      var project = $(this).find('option:selected').val();
      // AjaxPOSt wit CSRF
      var data = {
      action:'role',
      project: project,
      "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
      };
      $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
      role_data = '<option value="0">All</option>';
      $.each(json, function(index, obj){
      role_data += '<option value="'+obj.user_owner+'">'+obj.user_owner+'</option>';
      });
      // append all role data in Role dropdown
      $role.html(role_data);
      }, 'JSON');
      });

      // on change user ID, get project
      $projects.on('change', function () {
      // get selected project name
      var project = $(this).find('option:selected').val();
      // AjaxPOSt wit CSRF
      var data = {
      action:'userid',
      project: project,
      "<?=$this->security->get_csrf_token_name()?>" : "<?=$this->security->get_csrf_hash()?>"
      };
      $.post('<?php echo base_url(); ?>Dashboard/perfomance_monitoring', data, function(json) {
      userid_data = '<option value="0">All</option>';
      $.each(json, function(index, obj){
      userid_data += '<option value="'+obj.user_id+'">'+obj.user_id+'</option>';
      });
      // append all role data in Role dropdown
      $userid.html(userid_data);
      }, 'JSON');
      });
      });

      </script>


      This is my Controller:



      $array_data = array();
      // only on Ajax Request
      if ($this->input->is_ajax_request()) {
      // if request for projects
      if ($this->input->post('action') && $this->input->post('action') == 'project') {
      // get customer name
      $customer = $this->input->post('customer', true);
      // get project data by customer name
      $array_data = $this->ixt_models->fetch_project(trim($customer), 'project');
      // AjaxPOST JSON response
      echo json_encode($array_data);die();
      }


      This is my Model:



      public function fetch_project($where_data = null, $type = null)
      {
      $query = '';

      // customer only
      if (is_null($type) && is_null($where_data)) {
      // desire column from table
      $this->db->select('cust_id');
      // only unique customer
      $this->db->distinct('cust_id');
      // mysql table
      $query = $this->db->get($this->table_helper);
      }

      // projects by customer
      elseif ($type == 'project' && !is_null($where_data)) {
      // desire column from table
      $this->db->select('project_id');
      // where clause
      $this->db->where('cust_id', $where_data);
      // mysql table
      $query = $this->db->get($this->table_helper);
      }


      Right now, Project Textfield only show one choice when Customer take more than one selection :
      Click here







      javascript php codeigniter drop-down-menu






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 23 '18 at 9:48









      aldialdi

      325




      325
























          1 Answer
          1






          active

          oldest

          votes


















          0














          You can try this code.



          JavaScript code:



          function onchangeFunctionName(id) {
          if (id == '') {
          $('#SelectedId').prop('disable', true);
          } else {
          $('#SelectedId').prop('disable', false);
          $.ajax({
          url: base_url + '/Url here get value by selected value',
          type: "GET",
          data: {'id': id},
          dataType: 'json',
          async: false,
          success: function(data) {
          $.each(data, function(key, value) {
          $('#IdNameWhereShowValue').append('<option ' ' value="' + value.valueId + '">' + value.ValueName + '</option>');
          });
          },
          error: function() {
          }
          });
          }
          }


          Controller code:



          $array_data = $this->ModelName->MethodName(PassIdhere passed by the js code);

          echo json_encode(array_data);





          share|improve this answer

























            Your Answer






            StackExchange.ifUsing("editor", function () {
            StackExchange.using("externalEditor", function () {
            StackExchange.using("snippets", function () {
            StackExchange.snippets.init();
            });
            });
            }, "code-snippets");

            StackExchange.ready(function() {
            var channelOptions = {
            tags: "".split(" "),
            id: "1"
            };
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function() {
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled) {
            StackExchange.using("snippets", function() {
            createEditor();
            });
            }
            else {
            createEditor();
            }
            });

            function createEditor() {
            StackExchange.prepareEditor({
            heartbeatType: 'answer',
            autoActivateHeartbeat: false,
            convertImagesToLinks: true,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: 10,
            bindNavPrevention: true,
            postfix: "",
            imageUploader: {
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            },
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            });


            }
            });














            draft saved

            draft discarded


















            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53444205%2fdepending-dropdown-from-multi-select-codeigniter%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown

























            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes









            0














            You can try this code.



            JavaScript code:



            function onchangeFunctionName(id) {
            if (id == '') {
            $('#SelectedId').prop('disable', true);
            } else {
            $('#SelectedId').prop('disable', false);
            $.ajax({
            url: base_url + '/Url here get value by selected value',
            type: "GET",
            data: {'id': id},
            dataType: 'json',
            async: false,
            success: function(data) {
            $.each(data, function(key, value) {
            $('#IdNameWhereShowValue').append('<option ' ' value="' + value.valueId + '">' + value.ValueName + '</option>');
            });
            },
            error: function() {
            }
            });
            }
            }


            Controller code:



            $array_data = $this->ModelName->MethodName(PassIdhere passed by the js code);

            echo json_encode(array_data);





            share|improve this answer






























              0














              You can try this code.



              JavaScript code:



              function onchangeFunctionName(id) {
              if (id == '') {
              $('#SelectedId').prop('disable', true);
              } else {
              $('#SelectedId').prop('disable', false);
              $.ajax({
              url: base_url + '/Url here get value by selected value',
              type: "GET",
              data: {'id': id},
              dataType: 'json',
              async: false,
              success: function(data) {
              $.each(data, function(key, value) {
              $('#IdNameWhereShowValue').append('<option ' ' value="' + value.valueId + '">' + value.ValueName + '</option>');
              });
              },
              error: function() {
              }
              });
              }
              }


              Controller code:



              $array_data = $this->ModelName->MethodName(PassIdhere passed by the js code);

              echo json_encode(array_data);





              share|improve this answer




























                0












                0








                0







                You can try this code.



                JavaScript code:



                function onchangeFunctionName(id) {
                if (id == '') {
                $('#SelectedId').prop('disable', true);
                } else {
                $('#SelectedId').prop('disable', false);
                $.ajax({
                url: base_url + '/Url here get value by selected value',
                type: "GET",
                data: {'id': id},
                dataType: 'json',
                async: false,
                success: function(data) {
                $.each(data, function(key, value) {
                $('#IdNameWhereShowValue').append('<option ' ' value="' + value.valueId + '">' + value.ValueName + '</option>');
                });
                },
                error: function() {
                }
                });
                }
                }


                Controller code:



                $array_data = $this->ModelName->MethodName(PassIdhere passed by the js code);

                echo json_encode(array_data);





                share|improve this answer















                You can try this code.



                JavaScript code:



                function onchangeFunctionName(id) {
                if (id == '') {
                $('#SelectedId').prop('disable', true);
                } else {
                $('#SelectedId').prop('disable', false);
                $.ajax({
                url: base_url + '/Url here get value by selected value',
                type: "GET",
                data: {'id': id},
                dataType: 'json',
                async: false,
                success: function(data) {
                $.each(data, function(key, value) {
                $('#IdNameWhereShowValue').append('<option ' ' value="' + value.valueId + '">' + value.ValueName + '</option>');
                });
                },
                error: function() {
                }
                });
                }
                }


                Controller code:



                $array_data = $this->ModelName->MethodName(PassIdhere passed by the js code);

                echo json_encode(array_data);






                share|improve this answer














                share|improve this answer



                share|improve this answer








                edited Nov 26 '18 at 3:37









                Davіd

                3,68041635




                3,68041635










                answered Nov 23 '18 at 11:41









                PHP GeekPHP Geek

                1,2811717




                1,2811717






























                    draft saved

                    draft discarded




















































                    Thanks for contributing an answer to Stack Overflow!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function () {
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53444205%2fdepending-dropdown-from-multi-select-codeigniter%23new-answer', 'question_page');
                    }
                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    Popular posts from this blog

                    404 Error Contact Form 7 ajax form submitting

                    How to know if a Active Directory user can login interactively

                    TypeError: fit_transform() missing 1 required positional argument: 'X'