Populate TextBox based on multiple DropDownList selected value in JavaScript

indradeo
 
on Mar 17, 2021 12:50 AM
502 Views

Thanks For help to previous question.

How to fill COMPLAINT BOX using JAVA Script

"Printer -:- Personal :- Installation/Driver Issue :-H-type"

If user select drop down values then values fill to COMPLAINT BOX like "Printer -:- Personal :- Installation/Driver Issue :-H-type".

        <h4>COMPLAINT CATEGORY</h4>
        <select name="cat" size="1" onchange="redirect(this.options.selectedIndex)">
            <option value="0" selected>Select a category</option>
            <option value=""></option>
            <option value="--">-----------------------------------------</option>
            <option value="PC -">PC</option>
            <option value="Printer -">Printer</option>
            <option value="Phone">Phone</option>
            <option value="Scanner -">Scanner</option>
            <option value="UPS -">UPS</option>
            <option value="Network -">Network</option>
            <option value="Application -">Application</option>
            <option value="Software -">Software</option>
            <option value="General -">General</option>
            <option value="ERP -">ERP</option>
            <option value="Mail -">Mail</option>
        </select>      
        <div name="dvPrinter" style="display:none;">
            <h4>PRINTER TYPE:</h4>
            <select name="printer" size="1" onchange="document.forms.form1.str.value=document.forms.form1.cat.value+':- '+document.forms.form1.printer.value">
                <option value="0" selected>Select a category</option>
                <option value=""></option>
                <option value="--">-----------------------------------------</option>
                <option value="Personal -">Personal</option>
                <option value="Common -">Common</option>
               
            </select>
        </div>       
        <h4> TYPE</h4>
        <select name="type" size="1" onchange="document.forms.form1.str.value=document.forms.form1.cat.value+':- '+document.forms.form1.type.value"></select>
        <script type="text/javascript">
            var groups = document.forms.form1.cat.length
            var group = new Array(groups)
            for (i = 0; i < groups; i++)
                group[i] = new Array()
 
            group[3][0] = new Option("CD/DVD/Pen--Drive/Writer not working", "CD/DVD/Pen--Drive/Writer problem")
            group[3][1] = new Option("Monitor problem", "Monitor problem")
            group[3][2] = new Option("Keyboard Problem", "Keyboard Problem")
            group[3][3] = new Option("Mouse Problem", "Mouse Problem")
            group[3][4] = new Option("PC Not Booting", "Booting Problem")
            group[3][5] = new Option("PC Running slow", "PC Running slow")
            group[3][6] = new Option("PC Connection Problem", "PC Connection Problem")
            group[3][7] = new Option("PC Shifting", "PC Connection Problem")
 
            group[4][0] = new Option("Paper Jam Problem", "Paper Jam Problem")
            group[4][1] = new Option("Printer not Installed/Issue", "Installation/Driver Issue")
            group[4][2] = new Option("Garbage/Junk Printing Problem", "Garbage Printing Problem")
            group[4][3] = new Option("Red LED/Error Light Blinking ", "Printer Error(Red LED)")
 
            group[5][0] = new Option("Intercom Dead", "Intercom Dead")
            group[5][1] = new Option("Landline Dead", "Landline Dead")
            group[5][2] = new Option("Phone Set Problem", "Phone Set Problem")
            group[5][3] = new Option("Line shifting", "Line shifting")
 
            group[6][0] = new Option("Device Connectivity Error", "Connectivity Problem")
            group[6][1] = new Option("Driver Installation/Issue", "Driver problem")
            group[6][2] = new Option("Not scanning Properly", "Function Problem")
 
            group[7][0] = new Option("Cannot Start", "On/Off Problem")
            group[7][1] = new Option("Not giving Backup", "Backup Problem")
            group[7][2] = new Option("DG Set Switching Problem", "DG Set Switch problem")
            group[7][3] = new Option("eProcurement System")
 
            group[8][0] = new Option("Internet not working", "Internet Problem")
            group[8][1] = new Option("Intranet not opening", "Intranet problem")
            group[8][2] = new Option("Links/Peoplesoft does not open", "Links Problem")
            group[8][3] = new Option("Internet/Intranet Slow", "Intranet/Internet slow speed Problem")
 
            group[9][0] = new Option("Complaint Management Sys. not working", "IT Assets sys. Problem")
            group[9][1] = new Option("E-Workspace not working", "E-Workspace Appl. problem")
            group[9][2] = new Option("EIS not working", "EIS Appl. problem")
            group[9][3] = new Option("File Tracking System not working", "FTS Appl. problem")
            group[9][4] = new Option("OS daily report not working", "OS-Daily report Appl. problem")
            group[9][5] = new Option("RED(N)'s Desk not working", "RED(N)'s Appl. Problem")
            group[9][6] = new Option("GDAMS application Problem", "GDAMS Problem")
            group[9][7] = new Option("Application USERID/PASSWORD Problem", "Userid/Password Problem")
            group[9][8] = new Option("Application Data not updated", "Appl. Data Problem")
            group[9][9] = new Option("MS Team")
            group[9][10] = new Option("MS Office")
            group[9][11] = new Option("Adobe")
            group[9][12] = new Option("Java")
            group[9][13] = new Option("Finmat")
            group[9][14] = new Option("eProcurement System")
 
            group[10][0] = new Option("Acorbat Reader Installation/Error", "Acrobat Issue")
            group[10][1] = new Option("Antivirus Patch/Virus Issue", "Antivirus Issue")
            group[10][2] = new Option("CD Writer S/W Installation/Error", "CD Writer S/W Issue")
            group[10][3] = new Option("Hindi Fonts Installation", "Hindi Fonts Issue")
            group[10][4] = new Option("MS Office Installation/Error", "MS Office Issue")
            group[10][5] = new Option("PDF Writer", "PDF Writer Issue")
            group[10][6] = new Option("Winzip/Winrar Installation/Issue", "Winzip/Rar Issue")
            group[10][7] = new Option("Installation of a software", "Some software to be loaded")
 
            group[11][0] = new Option("Intranet not updated", "Intranet Update Issue")
            group[11][1] = new Option("Lodged Complaint still pending", "Complaint Handling problem")
 
            group[12][0] = new Option("ESS ID Locked", "ESS ID Locked")
            group[12][1] = new Option("SAP - R/3 ID Locked", "SAP R/3 ID Locked")
            group[12][2] = new Option("ESS password forgetton", "ESS Password forgetton")
            group[12][3] = new Option("SAP password forgetton", "SAP - R/3 Password forgetton")
            group[12][4] = new Option("ESS Page not displayed properly", "ESS Page not displayed properly")
            group[12][5] = new Option("ESS/SAP not installed", "ESS/SAP not installed")
 
            group[13][0] = new Option("Cant open mail in Browser", "Browser Mail Problem")
            group[13][1] = new Option("Cant open Lotus Notes", "Lotus Notes Problem")
            group[13][2] = new Option("Internet Mail access problem", "Internet Mail access problem")
            group[13][3] = new Option("Archiving Problem", "Archiving Problem")
            group[13][4] = new Option("Certificate Expired", "Certificate Expired")
            group[13][5] = new Option("Mobile mail configuration", "Mobile mail configuration")
 
 
            var temp = document.forms.form1.type
            function redirect(x) {
                document.getElementsByName('dvPrinter')[0].style.display = "none";
                if (document.forms.form1.cat[x].text == 'Printer') {
                    document.getElementsByName('dvPrinter')[0].style.display = "block";
                }
                for (m = temp.options.length - 1; m > 0; m--)
                    temp.options[m] = null
                i = 0;
                temp.options[i] = new Option("", "type")
                for (i = 0; i < group[x].length; i++) {
                    temp.options[i + 1] = new Option(group[x][i].text, group[x][i].value)
                }
                temp.options[0].selected = true
            }
        </script>
        <div name="Location">
            <h4>Location:</h4>
            <select name="Location" size="1">
                <option value="0" selected>Select a category</option>
                <option value=""></option>
                <option value="--">-----------------------------------------</option>
                <option value="H-type">H-type</option>
                <option value="DM_Plant -">DM Plant</option>
		<option value="Service_Building -">Service Building</option>
		<option value="MGR">MGR</option>
		<option value="CHP">CHP</option>
		<option value="CCD_Township">CCD Township</option>
		<option value="Hospital_Township">Hospital Township</option>               
            </select>
        </div>
        <%if(not request.Form("cat")="0")Then%>
        <h4><!--If your complaint is not listed above or to add in, please specify below...--></h4>
        <center><u><h3 align="left">COMPLAINT BOX :</h3></u>
        </center>
        <table width="700" height="168" border="3" bgcolor="#99CCCC"bordercolor="#000000">
          <tr>
            <td width="120" scope="col"><center><b>COMPLAINT MESSAGE </b></center></td>
            <td><textarea name="str" rows=8 cols=88 maxlength=640 STYLE="color: #FFFFFF; font-family: Verdana; font-weight: bold; font-size: 12px; background-color: #72A4D2;"></TEXTAREA>
	    </td>
          </tr>     
        </table>

 

Download FREE API for Word, Excel and PDF in ASP.Net: Download
dharmendr
 
on Mar 17, 2021 05:08 AM

Hi indradeo,

Check this example. Now please take its reference and correct your code.

HTML

<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <form id="form1">
        <h4>COMPLAINT CATEGORY</h4>
        <select name="cat" size="1" onchange="redirect(this.options.selectedIndex);SetMessage();">
            <option value="0" selected="selected">Select a category</option>
            <option value=""></option>
            <option value="--">-----------------------------------------</option>
            <option value="PC -">PC</option>
            <option value="Printer -">Printer</option>
            <option value="Phone">Phone</option>
            <option value="Scanner -">Scanner</option>
            <option value="UPS -">UPS</option>
            <option value="Network -">Network</option>
            <option value="Application -">Application</option>
            <option value="Software -">Software</option>
            <option value="General -">General</option>
            <option value="ERP -">ERP</option>
            <option value="Mail -">Mail</option>
        </select>
        <br />
        <div name="dvPrinter" style="display: none;">
            <h4>PRINTER TYPE:</h4>
            <select name="printer" size="1" onchange="SetMessage()">
                <option value="0" selected="selected">Select a category</option>
                <option value=""></option>
                <option value="--">-----------------------------------------</option>
                <option value="Personal -">Personal</option>
                <option value="Common -">Common</option>
            </select>
        </div>
        <br />
        <h4>TYPE</h4>
        <select name="type" size="1" onchange="SetMessage()"></select>
        <br />
        <div name="Location">
            <h4>Location:</h4>
            <select name="Location" size="1" onchange="SetMessage()">
                <option value="0" selected="selected">Select a category</option>
                <option value=""></option>
                <option value="--">-----------------------------------------</option>
                <option value="H-type">H-type</option>
                <option value="DM_Plant -">DM Plant</option>
                <option value="Service_Building -">Service Building</option>
                <option value="MGR">MGR</option>
                <option value="CHP">CHP</option>
                <option value="CCD_Township">CCD Township</option>
                <option value="Hospital_Township">Hospital Township</option>
            </select>
        </div>
        <br />
        <h4>COMPLAINT MESSAGE</h4>
        <textarea cols="88" maxlength="640" name="str" rows="8"></textarea>
        <script type="text/javascript">
            var groups = document.forms.form1.cat.length
            var group = new Array(groups)
            for (i = 0; i < groups; i++)
                group[i] = new Array()

            group[3][0] = new Option("CD/DVD/Pen--Drive/Writer not working", "CD/DVD/Pen--Drive/Writer problem")
            group[3][1] = new Option("Monitor problem", "Monitor problem")
            group[3][2] = new Option("Keyboard Problem", "Keyboard Problem")
            group[3][3] = new Option("Mouse Problem", "Mouse Problem")
            group[3][4] = new Option("PC Not Booting", "Booting Problem")
            group[3][5] = new Option("PC Running slow", "PC Running slow")
            group[3][6] = new Option("PC Connection Problem", "PC Connection Problem")
            group[3][7] = new Option("PC Shifting", "PC Connection Problem")

            group[4][0] = new Option("Paper Jam Problem", "Paper Jam Problem")
            group[4][1] = new Option("Printer not Installed/Issue", "Installation/Driver Issue")
            group[4][2] = new Option("Garbage/Junk Printing Problem", "Garbage Printing Problem")
            group[4][3] = new Option("Red LED/Error Light Blinking ", "Printer Error(Red LED)")

            group[5][0] = new Option("Intercom Dead", "Intercom Dead")
            group[5][1] = new Option("Landline Dead", "Landline Dead")
            group[5][2] = new Option("Phone Set Problem", "Phone Set Problem")
            group[5][3] = new Option("Line shifting", "Line shifting")

            group[6][0] = new Option("Device Connectivity Error", "Connectivity Problem")
            group[6][1] = new Option("Driver Installation/Issue", "Driver problem")
            group[6][2] = new Option("Not scanning Properly", "Function Problem")

            group[7][0] = new Option("Cannot Start", "On/Off Problem")
            group[7][1] = new Option("Not giving Backup", "Backup Problem")
            group[7][2] = new Option("DG Set Switching Problem", "DG Set Switch problem")
            group[7][3] = new Option("eProcurement System")

            group[8][0] = new Option("Internet not working", "Internet Problem")
            group[8][1] = new Option("Intranet not opening", "Intranet problem")
            group[8][2] = new Option("Links/Peoplesoft does not open", "Links Problem")
            group[8][3] = new Option("Internet/Intranet Slow", "Intranet/Internet slow speed Problem")

            group[9][0] = new Option("Complaint Management Sys. not working", "IT Assets sys. Problem")
            group[9][1] = new Option("E-Workspace not working", "E-Workspace Appl. problem")
            group[9][2] = new Option("EIS not working", "EIS Appl. problem")
            group[9][3] = new Option("File Tracking System not working", "FTS Appl. problem")
            group[9][4] = new Option("OS daily report not working", "OS-Daily report Appl. problem")
            group[9][5] = new Option("RED(N)'s Desk not working", "RED(N)'s Appl. Problem")
            group[9][6] = new Option("GDAMS application Problem", "GDAMS Problem")
            group[9][7] = new Option("Application USERID/PASSWORD Problem", "Userid/Password Problem")
            group[9][8] = new Option("Application Data not updated", "Appl. Data Problem")
            group[9][9] = new Option("MS Team")
            group[9][10] = new Option("MS Office")
            group[9][11] = new Option("Adobe")
            group[9][12] = new Option("Java")
            group[9][13] = new Option("Finmat")
            group[9][14] = new Option("eProcurement System")

            group[10][0] = new Option("Acorbat Reader Installation/Error", "Acrobat Issue")
            group[10][1] = new Option("Antivirus Patch/Virus Issue", "Antivirus Issue")
            group[10][2] = new Option("CD Writer S/W Installation/Error", "CD Writer S/W Issue")
            group[10][3] = new Option("Hindi Fonts Installation", "Hindi Fonts Issue")
            group[10][4] = new Option("MS Office Installation/Error", "MS Office Issue")
            group[10][5] = new Option("PDF Writer", "PDF Writer Issue")
            group[10][6] = new Option("Winzip/Winrar Installation/Issue", "Winzip/Rar Issue")
            group[10][7] = new Option("Installation of a software", "Some software to be loaded")

            group[11][0] = new Option("Intranet not updated", "Intranet Update Issue")
            group[11][1] = new Option("Lodged Complaint still pending", "Complaint Handling problem")

            group[12][0] = new Option("ESS ID Locked", "ESS ID Locked")
            group[12][1] = new Option("SAP - R/3 ID Locked", "SAP R/3 ID Locked")
            group[12][2] = new Option("ESS password forgetton", "ESS Password forgetton")
            group[12][3] = new Option("SAP password forgetton", "SAP - R/3 Password forgetton")
            group[12][4] = new Option("ESS Page not displayed properly", "ESS Page not displayed properly")
            group[12][5] = new Option("ESS/SAP not installed", "ESS/SAP not installed")

            group[13][0] = new Option("Cant open mail in Browser", "Browser Mail Problem")
            group[13][1] = new Option("Cant open Lotus Notes", "Lotus Notes Problem")
            group[13][2] = new Option("Internet Mail access problem", "Internet Mail access problem")
            group[13][3] = new Option("Archiving Problem", "Archiving Problem")
            group[13][4] = new Option("Certificate Expired", "Certificate Expired")
            group[13][5] = new Option("Mobile mail configuration", "Mobile mail configuration")


            var temp = document.forms.form1.type
            function redirect(x) {
                document.getElementsByName('dvPrinter')[0].style.display = "none";
                if (document.forms.form1.cat[x].text == 'Printer') {
                    document.getElementsByName('dvPrinter')[0].style.display = "block";
                }
                for (m = temp.options.length - 1; m > 0; m--)
                    temp.options[m] = null
                i = 0;
                temp.options[i] = new Option("", "0")
                for (i = 0; i < group[x].length; i++) {
                    temp.options[i + 1] = new Option(group[x][i].text, group[x][i].value)
                }
                temp.options[0].selected = true
            }

            function SetMessage() {
                var str = document.forms.form1.str;
                var cat = document.forms.form1.cat.value;
                var printer = document.forms.form1.printer.value;
                var type = document.forms.form1.type.value;
                var location = document.forms.form1.Location.value;
                var message = "";
                if (cat != "0" && cat != '' && cat != '--') {
                    message += cat;
                }
                if (printer != "0" && printer != '' && printer != '--') {
                    message += ":- " + printer;
                }
                if (type != "0" && type != '' && type != '--') {
                    message += ":- " + type;
                }
                if (location != "0" && location != '' && location != '--') {
                    message += " :- " + location;
                }
                str.value = message;
            }
        </script>
    </form>
</body>
</html>

Demo