Where to store selected element values in same page?

Question

I have main.jsp which include 4 jsp pages i.e company.jsp,software.jsp,location.jsp,dept.jsp
and at the end will be Submit button which will be redirected to another jsp page

Note : In company.jsp and Software.jsp, only one radio button is to be clicked
In location.jsp ,dept.jsp has checkboxes with multiple selection of checkboxes

I want to refine my search Something like this:

enter image description here

I want to that when one of radio button is selected in company.jsp based on company selected software will be displayed from database. And when Software is selected locations with checkboxes will appear based on database.Then if locations are selected depts will be displayed based on database and so on..

I have tried using jquery in which selected radio button is added to the url as parameter But that is bad practice as I am changing url through window.location.href. And that is bad practice
Any other idea using servlet or jquery ?

Edit:

main.jsp

<div style="background-color:#F4F4F4"><b>Company:</b></div>
<div id="company"> <jsp:include page="company.jsp"></jsp:include> </div>
<div style="background-color:#F4F4F4"><b>Software:</b></div>
<div id="software">
<jsp:include page="software.jsp"></jsp:include> </div>
<div style="background-color:#F4F4F4"><b>Location:</b></div>
<div id="location">
<jsp:include page="my_location.jsp"></jsp:include> </div>

company.jsp

<script src="jquery-1.9.1.min.js"></script>
<script src="jquery-1.9.1.js"></script>
<script type="text/javascript">
function call(a)
{
    window.location.href="main.jsp?company="+a ;
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<%
Connection conn = null;
Class.forName("oracle.jdbc.driver.OracleDriver").newInstance();
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:XE","","");
ResultSet rs = null;
Statement st=null;
st=con.createStatement();
%>

<form name=company_form id=company_form>
<%
String name=request.getParameter("r");
if(name!=null){
//out.println("value in company.jsp:"+name);
}

%>
<br>
<%
try{
rs = st.executeQuery("select DISTINCT(COMPANY) from maindatabase");
int i=0; 
while(rs.next())
  {
%>
<input type="radio" name="r" onclick='call(this.value)' class='class_company' value="<%= rs.getString("COMPANY") %>"><%= rs.getString("COMPANY") %><br>
<%

//System.out.println("company count:"+i);
i++;
}


}
catch(SQLException e)
{ System.out.println(e.getMessage()); } 

%>
</form>

<script type="text/javascript">

function checkall()
{
        var prmstr = window.location.search.substr(1);
        //alert("string in company.jsp"+prmstr);
        var prmarr = prmstr.split ("&");
        var params = {};

        for ( var i = 0; i < prmarr.length; i++) {
            var tmparr = prmarr[i].split("=");
           // alert("tmparr[0] & tmparr[1] :"+tmparr[0]+" and "+tmparr[1] )
            params[tmparr[0]] = tmparr[1];
        }
         //alert("value to be selected in company.jsp:"+params.company);
        if(params.company=="company1")
            { 

            $('input:radio[value=company1]').attr('checked',true);  

            }
        else
            {
            if(params.company=="company2")
            { 

                $('input:radio[value=company2]').attr('checked',true); 
            }
            else
                {
                if(params.company=="company3")
                    {

                    $('input:radio[value=company3]').attr('checked',true);
                   }
                }       
            }

}
</script>
<script>
window.onload=checkall() ; 
</script>

software.jsp

<script type="text/javascript">
function stripWhiteSpace(arg){
       if(arg.replace(/^\s+/,'').replace(/\s+$/,'') == ""){
          return true;
       }
    }
function AddUrlParameter(a, b, c)
{
    if (stripWhiteSpace(b))
{
 alert("Parameter name should not be empty.");
 return a;
 } 
    if (stripWhiteSpace(c))
{
  alert("Parameter value should not be empty.");
  return a;
 }
if (a.indexOf("?") == -1)
{
  return a + "?" + b + "=" + c;
}
var d = a.split("?");
if (d.length >= 2)
{

      if (stripWhiteSpace(b))
    // if (d[1].trim() == "")
  {
      return d[0] + "?" + b + "=" + c;
  }
  var e = d[1].split(/[&;]/g);
  for (var f = 0; f < e.length; f++)
  {
    var g = e[f]; var h = g.split("=");
    if (h.length >= 2)
    {
      if (h[0] == b)
      {
           // alert("a :"+a);
            //  alert("b :"+b);
            //alert("c :"+c);
            /*
            if (stripWhiteSpace(b))
          {
            alert("Parameter name should not be empty.");
            return a ;
           }
            if (stripWhiteSpace(c))
          {
            alert("Parameter value should not be empty.");
            return a; 
          }
          var d = "";
          var e = false;
          var f = false;
          if (a.indexOf("?") == -1)
          {
             alert("No Url Parameters Found!");
             return a;
          }
          var g = a.split("?");
          if (g.length >= 2)
          {
            d = d + g[0] + "?";
            var h = g[1].split(/[&;]/g);
            for (var i = 0; i < h.length; i++)
            {
              var j = h[i];
              var k = j.split("=");
              if (k.length >= 2)
              {
                if (k[0] == b)
                {
                 f = true; k[1] = c;
                 d = d + b + "=" + c + "&";
                 }
                else 
                {
                    d = d + j + "&";
                }
                e = true;
              }
             }
            if (f == false)
            {
              alert("Requested query string not found to remove");
              return a;
             }
            if (e == true)
            {
              d = d.slice(0, d.length - 1);
            }
            return d; 
            }

          */
          alert("Url Parameter with provided name already exists! Try Updating that Url Parameter.");

          //UpdateUrlParameter(a, b, c);
          //return a;
       }
    }
   }
  return a + "&" + b + "=" + c;
  }
} 

</script>
<script type="text/javascript">
/*
function callsoft(a) {

    alert("hi");

    var id=document.getElementById("software");
    alert("id :"+id+" value"+a.value);

var $soft = $('input[name=soft]:checked'); 
      var softvalue = $soft.val();
      var id = $soft.attr('id');

      alert("radio clicked id:"+id+" and value: "+softvalue);

      var prmstr = window.location.search.substr(1);
        var prmarr = prmstr.split ("&");
        var params = {};

        for ( var i = 0; i < prmarr.length; i++) {
            var tmparr = prmarr[i].split("=");
              params[tmparr[0]] = tmparr[1];
        }
            var company=params.company;

    var companyurl="main.jsp?company="+company;
    alert(companyurl);

    var new_url = AddUrlParameter(companyurl,id,softvalue);

//var new_url = AddUrlParameter(window.location.href,id,softvalue);
window.location.replace(new_url);

*/


$(document).ready(function(){

    $('.class_sofware').click(function() {


        var $soft = $('input[name=soft]:checked'); 
              var softvalue = $soft.val();
              var id = $soft.attr('id');

              alert("radio clicked id:"+id+" and value: "+softvalue);

              var prmstr = window.location.search.substr(1);
            var prmarr = prmstr.split ("&");
            var params = {};

            for ( var i = 0; i < prmarr.length; i++) {
                var tmparr = prmarr[i].split("=");
                  params[tmparr[0]] = tmparr[1];
            }

            var company=params.company;

            var companyurl="main.jsp?company="+company;

            var new_url = AddUrlParameter(companyurl,id,softvalue);

       //var new_url = AddUrlParameter(window.location.href,id,softvalue);
       window.location.replace(new_url);


    });
});


</script>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<div id="i_all_sw">
<%
Connection conn = null;
Class.forName("oracle.jdbc.driver.OracleDriver").newInstance();
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:XE","","");
ResultSet rs = null;
Statement st=null;
st=con.createStatement();
%>

<%
String S_COMPANY=request.getParameter("company");
if(S_COMPANY!=null){
System.out.println(S_COMPANY);
}
%>
<%
try{
rs = st.executeQuery("select DISTINCT(SW_NAME) from maindatabase where COMPANY='"+S_COMPANY+"'");

int i=0; 
while(rs.next())
  {
%>
<input type="radio" name="soft" id="software" onclick="callsoft(this);" class="class_sofware" value="<%= rs.getString("SW_NAME") %>"><%= rs.getString("SW_NAME") %><br>
<%

//System.out.println("company count:"+i);
i++;
}


}
catch(SQLException e)
{ System.out.println(e.getMessage()); } 

%>
</div>
<script type="text/javascript">

function checkall()
{
        var prmstr = window.location.search.substr(1);
        //alert("string in software.jsp"+prmstr);
        var prmarr = prmstr.split ("&");
        var params = {};

        for ( var i = 0; i < prmarr.length; i++) {
            var tmparr = prmarr[i].split("=");
              params[tmparr[0]] = tmparr[1];
        }
        //alert("params.software value to be selected in software.jsp:"+params.software);
        $('input:radio[value='+params.software+']').attr('checked',true);  


}
</script>
<script>
window.onload=checkall();  
</script>

This is very well explained by BalusC here: [How to use Servlets and Ajax?](http://stackoverflow.com/q/4112686/1065197), check the *`MapString, String>` as ` — Luiggi Mendoza, Mar 06 '13 at 05:00
Don't worry, BalusC explains this as well. Read the answer and **learn a lot** (I did some time before) — Luiggi Mendoza, Mar 06 '13 at 05:04
i can use drop down only in company.jsp and software.jsp since i have to select only one, but for multiple selection checkbox will be better — lata, Mar 06 '13 at 05:10
@lata: "I have tried using jquery in which selected radio button is added to the url as parameter " Can you provide code for this ? This will help more. — Hardik Mishra, Mar 06 '13 at 06:53
@HardikMishra: plz see the changes although it is bad practice :( — lata, Mar 06 '13 at 07:09
@lata: Oh..You seriously need to read How to use Servlets and Ajax? mentioned in above comments. It will reduce JSP codes and should provide solution. — Hardik Mishra, Mar 06 '13 at 07:58

score 1 · Answer 1 · answered Mar 06 '13 at 05:05

1

In main.jsp do following coading

<form name="myForm" id="myFormId"
 action="/myServlet" method="POST">

 1. include company.jsp  
 2. include software.jsp
 3. include location.jsp
 4. include dept.jsp

<input type="submit" value="submit">
</form>

Note: name of radio button should be same in company.jsp and Software.jsp

When out will be rendered to browser there would be only one form element and inside form element there would be radio button and check boxes according to included JSP.

answered Mar 06 '13 at 05:05

Rais Alam

6,970
12
53
84

3

OP is aware of this. The main question is how to dynamically load the values of `software` radio buttons based on the selected `company`, and on and on... – Luiggi Mendoza Mar 06 '13 at 05:07
1

@lata the best way to do that is ajax. I think you need to learn tricks of ajax first. – Rais Alam Mar 06 '13 at 05:10
@Real: this means i can't get solution through servlets or JQuery? – lata Mar 06 '13 at 05:11
1

@lata in the link I posted before, BalusC shows how to use ajax with jQuery to call a Servlet. **Please** check it out, make some tests and do the job. – Luiggi Mendoza Mar 06 '13 at 05:12
No its not like that you can do that without ajax. Let me prepare some example code. – Rais Alam Mar 06 '13 at 05:12
@LuiggiMendoza: yaa without Ajax,code will be long but that's f9 – lata Mar 06 '13 at 05:15
@LuiggiMendoza you are making fun of others. – Rais Alam Mar 06 '13 at 05:25
@Real nope, an example like this will be a long wall of code, both HTML/JSP and Servlet. Note that at least you should show the answer by not using scriptlets since its deprecated technology: [How to avoid Java Code in JSP-Files?](http://stackoverflow.com/q/3177733/1065197), also refer to the posted link in my comments on OP's question to see BalusC long explanation. – Luiggi Mendoza Mar 06 '13 at 05:27

Where to store selected element values in same page?

1 Answers1