Radiobutton List and Javascript Methods problem

I have a radio button list: Emergency Contact Treatment Provider Staff Contact Financial Source Insurance Provider Other and I have JS functions for each List Item because I want to show different dropdown lists for each of the list item: function displayEmergencyContact() { // get source id of radio button if (document.getElementById('MainContent_rblConsentToReleaseInformation_0').value == 'Emergency Contact') { var emergencyContact = document.getElementById("MainContent_ddlEmergencyContact"); // source id of ddl emergencyContact.style.display = 'block'; var treatmentProvider = document.getElementById("MainContent_ddlTreatmentProvider"); treatmentProvider.style.display = 'none'; var staffContact = document.getElementById("MainContent_ddlStaffContact"); staffContact.style.display = 'none'; var financialSource = document.getElementById("MainContent_ddlFinancialSource"); financialSource.style.display = 'none'; var insuranceProvider = document.getElementById("MainContent_ddlInsuranceProvider"); insuranceProvider.style.display = 'none'; var other = document.getElementById("divOtherConsentToReleaseInformation"); other.style.display = 'none'; } } function displayTreatmentProvider() { if (document.getElementById('MainContent_rblConsentToReleaseInformation_1').value == 'Treatment Provider') { var emergencyContact = document.getElementById("MainContent_ddlEmergencyContact"); // source id of ddl emergencyContact.style.display = 'none'; var treatmentProvider = document.getElementById("MainContent_ddlTreatmentProvider"); treatmentProvider.style.display = 'block'; var staffContact = document.getElementById("MainContent_ddlStaffContact"); staffContact.style.display = 'none'; var financialSource = document.getElementById("MainContent_ddlFinancialSource"); financialSource.style.display = 'none'; var insuranceProvider = document.getElementById("MainContent_ddlInsuranceProvider"); insuranceProvider.style.display = 'none'; var other = document.getElementById("divOtherConsentToReleaseInformation"); other.style.display = 'none'; } } function displayStaffContact() { if (document.getElementById('MainContent_rblConsentToReleaseInformation_2').value == 'Staff Contact') { var emergencyContact = document.getElementById("MainContent_ddlEmergencyContact"); // source id of ddl emergencyContact.style.display = 'none'; var treatmentProvider = document.getElementById("MainContent_ddlTreatmentProvider"); treatmentProvider.style.display = 'none'; var staffContact = document.getElementById("MainContent_ddlStaffContact"); staffContact.style.display = 'block'; var financialSource = document.getElementById("MainContent_ddlFinancialSource"); financialSource.style.display = 'none'; var insuranceProvider = document.getElementById("MainContent_ddlInsuranceProvider"); insuranceProvider.style.display = 'none'; var other = document.getElementById("divOtherConsentToReleaseInformation"); other.style.display = 'none'; } } function displayFinancialSource() { if (document.getElementById('MainContent_rblConsentToReleaseInformation_3').value == 'Financial Source') { var emergencyContact = document.getElementById("MainContent_ddlEmergencyContact"); // source id of ddl emergencyContact.style.display = 'none'; var treatmentProvider = document.getElementById("MainContent_ddlTreatmentProvider"); treatmentProvider.style.display = 'none'; var staffContact = document.getElementById("MainContent_ddlStaffContact"); staffContact.style.display = 'none'; var financialSource = document.getElementById("MainContent_ddlFinancialSource"); financialSource.style.display = 'block'; var insuranceProvider = document.getElementById("MainContent_ddlInsuranceProvider"); insuranceProvider.style.display = 'none'; var other = document.getElementById("divOtherConsentToReleaseInformation"); other.style.display = 'none'; } } function displayInsuranceProvider() { if (document.getElementById('MainContent_rblConsentToReleaseInformation_4').value == 'Insurance Provider') { var emergencyContact = document.getElementById("MainContent_ddlEmergencyContact"); // source id of ddl emergencyContact.style.display = 'none'; var treatmentProvider = document.getElementById("MainContent_ddlTreatmentProvider"); treatmentProvider.style.display = 'none'; var staffContact = document.getElementById("MainContent_ddlStaffContact"); staffContact.style.display = 'none'; var financialSource = document.getElementById("MainContent_ddlFinancialSource"); financialSource.style.display = 'none'; var insuranceProvider = document.getElementById("MainContent_ddlInsuranceProvider"); insuranceProvider.style.display = 'block'; var other = document.getElementById("divOtherConsentToReleaseInformation"); other.style.display = 'none'; } } function displayOther() { if (document.getElementById('MainContent_rblConsentToReleaseInformation_5').value == 'Other') { var emergencyContact = document.getElementById("MainContent_ddlEmergencyContact"); // source id of ddl emergencyContact.style.display = 'none'; var treatmentProvider = document.getElementById("MainContent_ddlTreatmentProvider"); treatmentProvider.style.display = 'none'; var staffContact = document.getElementById("MainContent_ddlStaffContact"); staffContact.style.display = 'none'; var financialSource = document.getElementById("MainContent_ddlFinancialSource"); financialSource.style.display = 'none'; var insuranceProvider = document.getElementById("MainContent_ddlInsuranceProvider"); insuranceProvider.style.display = 'none'; var other = document.getElementById("divOtherConsentToReleaseInformation"); other.style.display = 'block'; } } This code is not working fine. I want one dropdown visible at a time and others must be hidden. Any helps would be highly appreciated. HTML CODE: This is each radio button's code:
I have 5 radio buttons that have Dropdowns and the last radio button has a div. Code of div is as under:

以上就是Radiobutton List and Javascript Methods problem的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » JavaScript 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏