选择下拉值时,在文本框中显示状态

when dropdown value is selected, show the status in textbox

我有一个添加商店的功能。在这个函数中,我可以select商店是OPEN还是CLOSE。我的目标是,在我的另一个模态上,

when I create a user and selected the shop I created, The status of the shop whether OPEN or CLOSE will appear on my textbox.

我在下面提供了我的代码和我的屏幕截图。任何帮助将不胜感激

HTML:

    <div class="col-md-3 float-left mb-2" >
               <button type="button" class=" btn-block btn bbutton  text-bold btn-lg" data-toggle="modal" data-target="#accountModal" 
    data-id="<?php echo $_SESSION['uid']?>" data-user="<?php echo $_SESSION['username']?>" 
                Edit <?php echo $_SESSION['uid']?>>
                Add User &emsp;
                </button> 


  <div class="modal fade" id="accountModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        
        <div class="modal-dialog" role="document">
            <div class="modal-content">
            <div class="modal-header" style="background-image: linear-gradient(90deg, #00e6ac, #1f9388);">
                <h5 class="modal-title text-bold" id="exampleModalLabel">Add Users For shop</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
                </button>
                
             </div>
            
            <div class="modal-body bg-white">
              <form id="createAccount"> 
               <div class="form-group" >
                <label>Company</label>
                  <select class="form-control" name="nameofshop" required>
                        <option value="">No Selected</option>
                        <?php 
                        foreach($category as $row):?>
                        <option value="<?php echo $row->shopName;?>"><?php echo $row->shopName;?></option>
                        <?php endforeach;?>
                    </select>
                    </div>
                    
                     <div class="form-group">
                     <label for="exampleInputEmail1">status:</label>
                         <label class="container">Open
                          <input type="radio"  name="status" value="open">
                   
                        </label>
                        <label class="container">Close
                          <input type="radio" name="status" value="close">
                
                        </label>
                    </div>
                    

              
                    </div>
           
                    
                    
                   
                    
                
                   
                    <button type="submit" class="btn btn btn-dark btn-flat float-right" value="">Submit</button>
            </form>
            </div>
           
            

         
            </div>
            
        </div>
        

        </div>

我会使用 javascript 监听商店输入字段中的任何变化。 Whenever an option is selected, I would take that option's value (let's say "icecreamshop" for instance), and get the status of that shop from the model.当您最终获得“关闭”状态时,您可以手动将其插入第二个输入字段。

使用jQuery的示例:

let shopField = $('#shop-field');
let statusField = $('#status-field');

shopField.change(() => {
   let status = findShopStatus($(this).val());
   statusField.val(status);
});

其中 findShopStatus 是一个函数,它通过商店的名称从模型中获取商店的状态。