Как сделать так, чтобы значение параметра включало более 1 значения? - PullRequest
Новая
       36

Как сделать так, чтобы значение параметра включало более 1 значения?

0 голосов
/ 04 мая 2020

У меня проблема с отображением 4 разных данных в полях ввода. Я создал функцию onchange, чтобы получить значение 1 в поле ввода, но как получить другие данные для отображения в других полях:

Ниже моя кодировка: 

<div class="form-group">
    <label for="cp1" class="control-label col-lg-4">Move to Sub Folder/New Category<span style="color:red;">&nbsp;*</span></label>
    <div class="col-lg-3">
        <select onchange="getComboA(this)" class="form-control blank" id="parentid" name="parentid" title="parentid">
            <option>Please Select</option>
            <option value="New Category_value">New Category</option>

            <?php
            $sql_incharge = 'select * from filing_code_management where status=1 order by id';
            $arr_incharge = db_conn_select($sql_incharge);

            foreach ($arr_incharge as $rs_incharge) {
                $folder_location      = $rs_incharge['folder_location'];
                $function_code_select = $rs_incharge['function_code'];
                $function_name_select = $rs_incharge['function_name']
                $activity_code_select = $rs_incharge['activity_code']
                $activity_name_select = $rs_incharge['activity_name']

                echo '<option value="' . $rs_incharge['function_code'] . '">' . $rs_incharge['name'] . '</option>';

            }
            ?>
        </select> 
        &nbsp;&nbsp;
        <!--<input type="text" class="form-control blank" id="parentid" name="parentid" title="parentid" onblur="capitalize(this.id, this.value);">-->
    </div>
</div>

<div class="form-group">
    <label for="cp1" class="control-label col-lg-4">Function Code:</label>
        <div class="col-lg-3">
        <input type="text" class="form-control" id="function_code" name="function_code" title="function_code" value="">
    </div>
</div>

<div class="form-group">
    <label for="cp1" class="control-label col-lg-4">Function Name:</label>
    <div class="col-lg-3">
        <input type="text" class="form-control" id="function_name" name="function_name" title="function_name">
     </div>
</div>

<div class="form-group">
    <label for="cp1" class="control-label col-lg-4">Activity Code:</label>
    <div class="col-lg-3">
        <input type="text" class="form-control" id="activity_code" name="activity_code" title="activity_code">
     </div>
</div>

<div class="form-group">
    <label for="cp1" class="control-label col-lg-4">Activity Name:</label>
    <div class="col-lg-3">
        <input type="text" class="form-control" id="activity_name" name="activity_name" title="activity_name">
    </div>
</div>

<script>

function getComboA(selectObject) {
    var value = selectObject.value;
    document.getElementById("function_code").value =value;
    document.getElementById("function_name").value =value;
    document.getElementById("activity_code").value =value;
    document.getElementById("activity_name").value =value;
}

<script>

Теперь мои выходные данные показывают 4 одинаковые данные в полях ввода, как показано на рисунке ниже: Выход 1

На самом деле я хочу показать 4 разных данных, теперь я просто беру первые данные используя этот код $ rs_incharge ['код_функции'], как эти $ rs_incharge ['имя_функции'], $ rs_incharge ['код_активности'] $ rs_incharge ['имя_операции'] могут показать другое поле, надеюсь, кто-нибудь поможет мне решить эту проблему , Благодаря.

Ответы [ 2 ]

0 голосов
/ 04 мая 2020

Вы должны сохранить данные в дополнительных атрибутах в самом <option>, затем получить значения onchange и затем выполнить свою операцию. Это должно помочь вам. 

<select onchange="getComboA(this)" class="form-control blank" id="parentid" name="parentid" title="parentid">
    <option selected disabled>Please Select</option>
    <!--Make this selected by default-->
    <option value="New Category_value" data-act_code="Your-default-act-code" data-act_name="Your-default-act-name">New Category</option

    <?php

    $sql_incharge = 'select * from filing_code_management where status=1 order by id';
    $arr_incharge = db_conn_select($sql_incharge);

    foreach ($arr_incharge as $rs_incharge) {
        $folder_location      = $rs_incharge['folder_location'];
        $function_code_select = $rs_incharge['function_code'];
        $function_name_select = $rs_incharge['function_name']
        $activity_code_select = $rs_incharge['activity_code']
        $activity_name_select = $rs_incharge['activity_name']

        // save the data here↓↓ in data attributes 
        echo "<option value='{$function_code_select}' data-act_code='{$activity_code_select}' data-act_name='{$activity_name_select}'>{$function_name_select}</option>";

    }

    ?>
</select>

Тогда в вашем script 

<script>

function getComboA(selectObject) {

    let func_code = selectObject.value; // get the value of selected option
    let func_name = selectObject.selectedOptions[0].textContent; // get the text of selected option
    let act_code  = selectObject.selectedOptions[0].getAttribute("data-act_code"); // get attribute of selected option
    let act_name  = selectObject.selectedOptions[0].getAttribute("data-act_name"); // get attribute of selected option

    document.getElementById("function_code").value = func_code;
    document.getElementById("function_name").value = func_name;
    document.getElementById("activity_code").value = act_code;
    document.getElementById("activity_name").value = act_name;
}

</script>

Ниже приведена краткая демонстрация того, о чем я говорю: 

function getComboA(selectObject) {

  let func_code = selectObject.value; // get the value of selected option
  let func_name = selectObject.selectedOptions[0].textContent; // get the text of selected option
  let act_code = selectObject.selectedOptions[0].getAttribute("data-act_code"); // get attribute of selected option
  let act_name = selectObject.selectedOptions[0].getAttribute("data-act_name"); // get attribute of selected option

  document.getElementById("function_code").value = func_code;
  document.getElementById("function_name").value = func_name;
  document.getElementById("activity_code").value = act_code;
  document.getElementById("activity_name").value = act_name;
}
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<select onchange="getComboA(this)" class="form-control blank" id="parentid" name="parentid" title="parentid">
  <option selected disabled>Please Select</option>
  <!--Make this selected by default-->
  <option value="New Category_value" data-act_code="Your-default-act-code" data-act_name="Your-default-act-name">New Category</option>
  <!-- Provide default values here -->
  <!-- After giving values via PHP your HTML code should look like this-->
  <option value='Function Code 1' data-act_code='Activity Code 1' data-act_name='Activity Name 1'>Function Name 1</option>
  <option value='Function Code 2' data-act_code='Activity Code 2' data-act_name='Activity Name 2'>Function Name 2</option>
  <option value='Function Code 3' data-act_code='Activity Code 3' data-act_name='Activity Name 3'>Function Name 3</option>
</select>

Function Code: <input type="text" class="form-control" id="function_code" name="function_code" title="function_code" /><br>
Function Name: <input type="text" class="form-control" id="function_name" name="function_name" title="function_name" /><br>
Activity Code: <input type="text" class="form-control" id="activity_code" name="activity_code" title="activity_code" /><br>
Activity Name: <input type="text" class="form-control" id="activity_name" name="activity_name" title="activity_name" />
0 голосов
/ 04 мая 2020

Добро пожаловать в Stackoverflow. Не могли бы вы привести минимальный рабочий пример? Я не могу запустить программу на своем локальном хосте, потому что у меня нет доступа к вашей базе данных. Попробуйте извлечь реальную проблему, например, предоставив пример результата базы данных в виде константного массива вместо выполнения запроса к базе данных.

Кроме того, кажется, что javascript функция getComboA () может быть проблема в том, что вы устанавливаете одинаковое значение для всех текстовых полей.

...