在JavaScript /组件中选择多个单选按钮组

时间:2019-04-04 09:25:10

标签: javascript arrays object web-component

我想知道如何在javasscript / components中显示单选按钮检查值,我有两个对象,对于每个对象,将生成两个单选按钮,我需要显示为相应ID选择的单选按钮值

var obj=[
{
    id:"id1",
    in:"trans" 
},
{ 
  id:"id2",
  in:"insta"
}
] 


  handleSend(){
    var selected_sendoption = this.shadowRoot.querySelector('input[name = "sending"]:checked').value;
    var service_send = this.shadowRoot.getElementById("paymentservice_receive");
   service_send.innerHTML = selected_sendoption;
  }


render(){
return html`
   ${obj.map((pr)=>{
     <div class="form-check" @click=${this.handleSend}>
       <input class="form-check-input" name="sending" type="radio" id="provider-send-${obj.id}" value="trans">Trans
       <input class="form-check-input" name="sending" type="radio" id="provider-send-${obj.id}" value="insta">Insta
   </div>
<p id="service_send"></p> // display the selected radio button value for corresponding obj selected
   })
  }`;
}


Expected Output

For Obj1,display two radio buttons
For Obj2, display two radio buttons

Display the selected radio button value for corresponding id

0 个答案:

没有答案