How to use a modelAttribute value in Jquery for Select box - java

I have a Map fetched from a database and I want to use the data to populate Select box. The Map is added to the model using sellerCodeList
In Spring it is simple:
<form:select path="orderDetails[0].SellerItemCode" items="${sellerCodeList}">
</form:select>
But I want to use the same in a Jquery function which builds up my select box. (Reason: I have a table with dynamic rows and each row has a select box as one of the element)
When I use the following I start getting error/exception
$("#poFields").append('<tr valign="top"><td>
<form:select path="orderDetails['+rowNum+'].SellerItemCode" items="${sellerCodeList}">
</form:select>');
This throws an exception
I see on SO that there is a way to iterate over the sellerCodeList and feed to options as per the following Dropdown link from SO
I am not good with JSON stuff though ;-)
Can someone please help

You'll need to "print" your items into JS so that your JS code has access to them. Something like this:
<script>
var sellerCodes = {};
<c:forEach items="${sellerCodeList}" var="entry">
sellerCodes['${entry.key}'] = '${entry.value}';
</c:forEach>
// you can now use sellerCodes in your JS code as a map.
</script>

Related

Unable to I to display the list value in dropdown which I am passing as list from my java class in my JSP.My code works perfectly if I am using table

I am passing list from my java class in my JSP where I want to display the list value in dropdown.
While debugging I checked that the list is containing desired values but not displaying in my JSP dropdown.
Though the values are coming if I am displaying in Table form.
Please, tell me where I am going wrong and how can I make my code to work?
Java Code:
// add the event list to the model
theModel.addAttribute("event", theEvents);
return "fundContributionCollectionListPage";
JSP Code:
<select name="eventSelected">
<c:forEach var="tempEvents" items="${event}">
<option value="tempEvents.eventName">${tempEvents.eventName}</option>
</c:forEach>
</select>

How to get all values from a select box(selected & not selected) in jsp

I have a HTML select box which have multi select enabled in my jsp. I'm populating options for that dynamically from other button. So user won't be selecting any values from that select box. I have to pass all the values of my selectbox to other jsp.
I'm navigating through jsp using form action submit. When doing that I cannot able to get all my select box values.
request.getParameterValues
This one giving only the selected values from that multi-select box. What I want is to get all values from that selectbox no matter selected or not.
Thanks;
Well simply loop through your select and get every option value, try the following:
var select = document.getElementById('mySelect');
for(var i=0; i<select.options.length;i++){
console.log(select.options[i].value);
}
This is a DEMO Fiddle.
For this you can use Web Storage for store the value and getting back that value form Web Storage.
For more detail you can visit below links.
Create a localStorage name/value pair
Example: for Web Storage
Code Below
you can store data in 1st Page (Html1.html) as below code :
localStorage.setItem("key", "value");
you can get the data on 2nd Page (Html2.html) as below code :
var valueFromFirstPage = localStorage.getItem("key");
You can store the list of values to the HttpSession and retrieve them wherever you need for the user session.
In your jsp ,
HttpSession session =request.getSession(false);
session.setAttribute("ListName", yourListHere);
to set the values to the session and to retrieve them,
session.getAttribute("ListName");
Related:
Storing and retrieving values from JSP to servlet using Sessions
In your first jsp, have a hidden field with all possible values for the select box, so that on the next jsp you will have the values by the given name, of-course name will be different for hidden field and the select box.
CSV hidden
first.jsp
<select name='chosen' multiple>
...
</select>
<input type='hidden' name='toChoose' value='1,2,3,4'/>
next.jsp
String[] chosen = request.getParameterValues("chosen");
String[] toChoose = request.getParameter("toChoose").split(",");
multiple hidden
first.jsp
<select name='chosen' multiple>
...
</select>
<input type='hidden' name='toChoose' value='1'/>
<input type='hidden' name='toChoose' value='2'/>
....
next.jsp
String[] chosen = request.getParameterValues("chosen");
String[] toChoose = request.getParameterValues("toChoose");

List of strings from java to html to jquery using data attributes

I am trying to display dynamically some data from the server side (struts java) using jquery datatable, first I tried to hard code my data testing in a jsfidle, thing works fine:
http://jsfiddle.net/jakecigar/c918of3t/35/
<td class="details-control" data-agencies='["agency22", "agency33","agency17","agency89"]'></td>
when you click in the green plus icon you will see the detail data coming from data attributes, but when I try it dynamically:
http://s4.postimg.org/8d7ki80q5/rr2.png
it does not work.
I found the solution, I just added single quotes around my property bean in my jsp :
<td class="details-control" data-agencies='<bean:write name="rrag" property="agencies" />'></td>

get text from dynamic table cell to to database

Alright so what I want to do is save text from my table to the database. The table is dynamically generated via a hibernate connection to the db. A sample of the html in the .jsp for the table:
display:column property="ticketId" href="/ossWeb/displayTicketEdit.do" paramId="ticketId" title="Ticket ID"/>
<display:column property="ATCNotes" title="ATC Notes" class="notes" />
<display:column property="issue" title="Issue"/>
<display:column property="status" title="Status"/>
Each property maps directly to a column of a view in the db.
I use this jQuery to allow any cell in the ATC Notes column to be clicked and turn into a text box:
$(".notes").live('click',(
function(){
var text = $(this).text();
$(this).text('');
$('<input type="text" />').appendTo($(this)).val(text).select().blur(
function(){
var newText = $(this).val();
$(this).parent().text(newText).find('input:text').remove();
});
}));
When you click off the cell, the text replaces what was already in the cell. Each row corresponds to a ticketId as can be seen in my first line of the jsp. Now my question is, how do I get that entered text to the db? I have a check box on each row, and for that, I can just assign it a value of "${ATCQueue.ticketId}" but there doesn't seem to be any similar way to differentiate each cell in the ATC Notes column.
I've heard of AJAX being used for something somewhat close to this, but honestly I'm pretty new to this and know next to nothing about AJAX.
I don't think you mandatorily need AJAX for this. You can write an action servlet and submit the form.
Or you can go for native AJAX using XMLHttpRequest/Response. Another way would be to use DWR framework.
1.First thing if you want to save bulk amount of data I i.e; multiple row and multiple column then you need to set a flag(a hidden field or
local storage in html 5) for modified rows.
2.Iterate through th rows of the table and generate xml or json .
3.yes you heard it right the Ajax, now send the data to your code behind through Ajax call.

How to fetch data that will be stored in the select option value in the form?

I want to dynamically fetch or get data from database and populate the select box. This is my code:
<form action="addchangerequest" method="post">
<select name="type">
<option value="Non-Sap">Non-Sap</option>
<option value="Sap">Sap</option>
</select>
<select name="assettriggered">
** I want to populate these option values upon making a selection to the first select box. These option will be the data coming from the database**
</select>
</form>
This is my method class.
public List sortDeployed(String userID)
{
List deployedlist = new ArrayList();
try
{
PreparedStatement pstmt = conn.prepareStatement(SORT_ID);
pstmt.setString(1, userID);
ResultSet rs = pstmt.executeQuery();
while(rs.next())
{
StoreAssetBean storeAssetBean = new StoreAssetBean();
storeAssetBean.setDeployedID(rs.getInt("AssetDeployed_ID"));
storeAssetBean.setName(rs.getString("Asset_Name"));
storeAssetBean.setMmoID(rs.getString("UserDivision_ID"));
storeAssetBean.setDepartment(rs.getString("User_Department"));
storeAssetBean.setDepType(rs.getString("AssetDeployed_Type"));
storeAssetBean.setDeployedDateTime(rs.getString("AssetDeployed_DateTime"));
deployedlist.add(storeAssetBean);
}
}
catch(SQLException e)
{
System.out.println(e);
}
return deployedlist;
}
I want the AssetDeployed_Type data must be imported to the select box named "assettriggered". Im using MVC Model 2 JSP Servlet. I've search about ajax, but i have no experience in implementing it. I want it to be dynamic data fetch when I select value in the first select box. Please help me guys, thank you in advance!!
That's quite easy to do as you understand what steps you need to take.
Send an AJAX request on some JavaScript event you desire. In your case it is onchange of the first <select>. You can of course send XMLHttpRequest on your own, but that's much easier (and stable) to do by using a well-established JS library like jQuery.
The request is received by a dedicated servlet that accepts some data that will be used to fetch the necessary data in java code and send the fetched data in JSON format back to the webbrowser. The incoming data is the value of the selected <option> of the first <select> element and possibly, id of the fetch operation, if you intend to use this servlet for other purposes. Serialization of data returned from the servlet to JSON format can be done by using a library like Gson.
When servlet response successfully arrives back to the client, a JS callback function will be executed with data from servlet available therein. You would use that data to create HTML elements, populate them with application-specific data and update HTML DOM (second <select> element) with the freshly fetched data.

Categories