Getting Data From the DataBase by Using Ajax and Json

[6年前 に venky yuvan によって更新されました。]

Hi ..
Requirement :
Getting the data from the data base by using select box option ID and showing the name beside text box and select box by using Ajax ,json and Jquery.

Example :
Id name City
122 Venky Nellore
Solution:
Jsp Page :

<portlet:resourceurl var="resourceURL"></portlet:resourceurl>
<div class="form-group">
					<label for="">WareHouse ID</label>
					<select class="form-control" id="wareHouseID" name="wareHouseID">
						<option value="">Select</option>
						&lt;%for(Warehouse warehouse : wdata){ %&gt;
							  
                                                                   &lt;%=warehouse.getCheckDigitCode()%&gt;
                                                      
						&lt;%} %&gt;
					</select>
</div>
<div class="col-lg-3">
				<div id="WarehoseId" class="form-group">
					<label for="">WareHouse Name :</label>
					 <input type="text" id="WarehouseName" value="" class="form-control" readonly>
				</div>
</div>

Script :

<script>
$(document).ready(function() {
	$('#wareHouseID').change(function() {
	       var id = $(this).val();
	       alert($(this).val());
	       alert("checkDigitCode=="+id)
	       jQuery.ajax({
	                url :'<%=resourceURL%>',           
	                data: { 
	                	"<portlet:namespace/>selectedId" : id 
	                },
	                type: "POST",
	            	dataType: "json",
	             	success: function(data) {  
	             		var Name = data.Name;
	             		var Status = data.Status;
	             		$("#WarehouseName").val(Name);
	             		if(Status == 1){
	             			$("#State").html("<option value='1'>Active</option>");
	             		} else if(Status == 2){
	             			$("#State").html("<option value='2'>DeActive</option>");
	             		} else if(Status == 3){	             			
	             			$("#State").html("<option value='3'>Progress</option>");
	             		} else if(Status == 4){	             			
	             			$("#State").html("<option value='4'>None</option>");
	             		}	             		
	              }
	            });
	      });
});
</script>

Controller:

public void serveResource(ResourceRequest resourceRequest, ResourceResponse resourceResponse)throws IOException, PortletException{
		long warehouseId = ParamUtil.getLong(resourceRequest,"selectedId");
		log.info("selectedId==="+warehouseId);
		PrintWriter writer = resourceResponse.getWriter();
		try {
			Warehouse warehouseData = WarehouseLocalServiceUtil.getWarehouse(warehouseId);
			String name=warehouseData.getName();
			int status = warehouseData.getStatus();
			log.info("name=="+name);
			log.info("status"+status);
			JSONObject objJsonObject = JSONFactoryUtil.createJSONObject();
                        objJsonObject.put("Name",warehouseData.getName());
                       objJsonObject.put("Status",warehouseData.getStatus());
                       writer.print(objJsonObject);
		} catch (PortalException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	 }

Thank You
Venky(Rjyuvan)

[6年前 に Olaf Kock によって更新されました。]

venky yuvan:

Requirement : getting the data from the data base by using select box option ID and showing the name beside text box and select box by using Ajax ,json and Jquery.

Is this a documentation of what you did, so that others can also use it, or do you have problems with this code and need help?

[6年前 に venky yuvan によって更新されました。]

Hi @Olaf Kock Sir

Here I gave Requirement and Solution (Both).

Thank You
venky(RjYuavan)