Win a copy of The Little Book of Impediments (e-book only) this week in the Agile and Other Processes forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

I want create UI desing in jsp using html and javascript

 
Arulmozhi Govindaraju
Greenhorn
Posts: 17
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I have attached JPEG format (design page)please any one help
Hi upload the page design image format the page doing in java server page using java -script and HTML and also using struts then db MySQL Du(department unit) sales select from database table once Du select what are the project assigned and unassigned split the box you know displayed we can assigned anything assigned or unassigned to submit and store the database
 
Swastik Dey
Rancher
Posts: 1643
6
Android Java Java ME
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Where is the attachment?
 
Arulmozhi Govindaraju
Greenhorn
Posts: 17
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Swastik Dey wrote:Where is the attachment?
page.jpg
[Thumbnail for page.jpg]
design of page jpg fomat attached
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65340
97
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Where is your code? What specific problems are you having with it.

Surely you are not expecting other people to do your work for you?
 
Arulmozhi Govindaraju
Greenhorn
Posts: 17
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:Where is your code? What specific problems are you having with it.

Surely you are not expecting other people to do your work for you?


what???
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65340
97
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Just what I asked. You haven't posted any code. What work have you done so far? We can't help you with your code is you don't post it. (Be sure to UseCodeTags when you do.)
 
Arulmozhi Govindaraju
Greenhorn
Posts: 17
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:Just what I asked. You haven't posted any code. What work have you done so far? We can't help you with your code is you don't post it. (Be sure to UseCodeTags when you do.)



Hi this is my coding

<%--

--%>





<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>

<%@ page import="java.util.*" %>
<%

LinkedHashMap<String,String> deliveryUnitMap = (LinkedHashMap)(request.getAttribute("DeliveryUnit") == null ?
(new LinkedHashMap<String, String>()): request.getAttribute("DeliveryUnit"));
LinkedHashMap<String,String> DepartmentMap = (LinkedHashMap)(request.getAttribute("Department") == null ?
(new LinkedHashMap<String, String>()): request.getAttribute("Department"));
//Added By hyder on 28-jan-2013 for adding behalfof --Starts

//Added By hyder on 28-jan-2013 for adding behalfof --Ends
%>

<html>
<head>
<link rel="stylesheet" type="text/css" href="styles/gems.css" />
<link href="styles/report_table.css" rel="stylesheet" type="text/css" />
<link href="styles/gems_base.css" rel="stylesheet" type="text/css" />
<link href="styles/jquery-ui.css" rel="stylesheet" type="text/css" />
<!-- <link type="text/css" href="http://jqueryui.com/latest/themes/base/jquery.ui.all.css" rel="stylesheet" />-->
<script type="text/javascript" src="./js/customJs.js"></script>
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/jquery-1.4.1.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/livevalidation.js"></script>
<script language="JavaScript" src="js/gen_validatorv31.js" type="text/javascript"></script>
<style>
.error_strings{ font-family:Verdana; font-size:10px; color:#FF0033;}
a img{border:none;}
a{
text-decoration:none;
border:none;
}
</style>
<SCRIPT type="text/javascript">




$(function() {
$("#fromDate").datepicker({ disabled: true,autoSize: true,minDate: 0 });
/*If mindate is set as 0-It means Today and onward,
If mindate is set as 1-It means Tomorrow and onward*/
$("#toDate").datepicker({ disabled: true,autoSize: true,minDate: 0 });
});


//purpose:sales configuration author:Arul Date:23-04-2013
//function makeAjaxCallForDept(Id){
// var DUId= document.getElementById("Project").value;
// var duDelUnit=document.forms[0].deliveryUnit.value;
// alert('duDelUnit: '+duDelUnit);
// alert('DUId' +DUId);
// var ajaxUrl = "<%=request.getContextPath()%>/AdvanceRequest.do?mtc=getDeptByProjId&ID="+Id+"&ID1="+duDelUnit;
// var deptResult = getAjaxResult(ajaxUrl);
//var projResult= result.substring(0,result.indexOf("@#%"));
//var deptResult= result.substring(result.indexOf("@#%")+3,result.length);
// var deptIdDescArray = splitAjaxResponse(deptResult);
// updateComponent(deptIdDescArray,'deptDiv','Department');
//}

////purpose:sales configuration author:Arul Date:23-04-2013 end



function makeAjaxCallForProj(Id){

var ajaxUrl = "<%=request.getContextPath()%>/ProjectEditAction.do?mtc=getProjByDuId&ID="+Id;
var projResult = getAjaxResult(ajaxUrl);
alert(projResult);

//var projResult= result.substring(0,result.indexOf("@#%"));
//var deptResult= result.substring(result.indexOf("@#%")+3,result.length);
var projIdDescArray = splitAjaxResponse(projResult);
updateComponent(projIdDescArray,'projDiv','Project');

}
function updateComponent(IdDescArray,divId,componentName)
{
var returnArray = [];
document.getElementById(componentName).options.length=0;
//var optionlist=document.createElement("option");
//document.getElementById(componentName).options.add(optionlist);
//optionlist.value="-1";
//optionlist.innerHTML="Select Any";
//optionlist.value="-3";
//optionlist.innerHTML="new";
var opt = document.createElement("option");
opt.value="-1";
opt.text="Select Any";
document.getElementById(componentName).options.add(opt);

//var opt1 = document.createElement("option");
//opt1.value="-2";
//opt1.text="new";
//document.getElementById(componentName).options.add(opt1);
var opt2 = document.createElement("option");
opt2.value="-3";
opt2.text="new";
document.getElementById(componentName).options.add(opt2);











if(IdDescArray.length > 0)
{
for(var i=0;i<IdDescArray.length;i++)
{
if(IdDescArray[i].indexOf("--") != -1)
{
returnArray = IdDescArray[i].split("--");
opt=document.createElement("option");
document.getElementById(componentName).options.add(opt);
opt.value=returnArray[0];
opt.innerHTML=returnArray[1];
opt.setAttribute("title", returnArray[0]+" - "+returnArray[1] );
}// end if
} // end for

} //end if




}





function getAjaxResult(url) {
var oXMLHTTP = getHTTPObject();
oXMLHTTP.open("GET", url, false);
oXMLHTTP.send("Firefox");
return oXMLHTTP.responseText;
}
function getHTTPObject() {
var xmlhttp;

if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
isIE = "true";
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.ActiveXObject) {
isIE = "true";
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
return xmlhttp;
}

function splitAjaxResponse(result){
var resultArray = [];
if(result.indexOf(" || ")!= -1){
resultArray = result.split(" || ");
//alert(subCatIdDescArray.length);
}
return resultArray;
}

function submitForm(mode)
{

var errMsg="Please provide the data for the following fields\n\n";
if(document.forms[0].deliveryUnit.value == -1) {
errMsg+="DU-Department\n";
}


if(document.forms[0].Project.value == -1){
errMsg+="Project Name\n";
}



// if((document.forms[0].subj.value.length>="0") &&(!validateSpecChars(document.forms[0].subj.value))){
//Modified alert messages by Priya.L on 09-dec-2011 w.r.t ticket-IM482810
//alert("Special characters are not allowed in Comments");
// alert('Kindly avoid special characters like /=+^?&!~*|":<>`\'$#% ');
// }



if(errMsg=="Please provide the data for the following fields\n\n"){
var x=window.confirm("Are you sure you want to Submit");
if(x){
document.forms[0].action = "<%=request.getContextPath()%>/ProjectEditAction.do?mtc=preLoadAR";

document.forms[0].submit();
disableAndShowProgressBar('submitId');
}else
return false;
}else{
alert(errMsg);
return false;
}
}
function validateString(string)
{
var iChars = '0123456789/+ -';
for (var i = 0; i < string.length; i++){
if (iChars.indexOf(string.charAt(i)) == -1){
return false;
}
}
return true;
}
function CompareDates()
{
var str1 = document.getElementById("fromDate").value;
var str2 = document.getElementById("toDate").value;
var mon1 = str1.substring(0,2);
var dt1 = str1.substring(3,5);
var yr1 = str1.substring(6,10);
var mon2 = str2.substring(0,2);
var dt2 = str2.substring(3,5);
var yr2 = str2.substring(6,10);
var date1 = yr1+mon1+dt1;
var date2 = yr2+mon2+dt2;
if(date2<date1)
{
return false;
}
return true;
}






function move_list_items(Project, to_select_list)
{
$("#"+Project+" option:selected").appendTo("#"+to_select_list);
}

//this will move all selected items from source list to destination list
function move_list_items_all(Project, to_select_list)
{
$("#"+Project+" option").appendTo("#"+to_select_list);
}









></SCRIPT>

</head>

<BODY >

<html:form action="/ProjectEditAction.do?mtc=" ><center>
<div id="right_col" style="width:970px">
<table border="0" >
<tr><th> <h1 class="menuhead">Du Project Sales Mapping </h1>




<!--inner table start-->





<table >
<tr>
<td ><fieldset><legend>New Delivery Unit</legend>
<table border="0" >
<tr>
<td >DU-Department:</td><td>
<select name="deliveryUnit" class="select_med" style="height: 19px;width: 200px;"
onchange="makeAjaxCallForProj(this.options[this.selectedIndex].value);">

<option value="-1">Select DU-Department</option>


<% Iterator d_it = deliveryUnitMap.keySet().iterator();
String duId="";
while(d_it.hasNext()){
duId=(String)d_it.next();
%>
<option title="<%=duId%> - <%=deliveryUnitMap.get(duId)%>" value="<%=duId%>"><%=deliveryUnitMap.get(duId)%></option>
<% } %>
</select></td>
</tr>

</tr></table></fieldset>
</td>

</div></table> <table >Assigned Projects         Unassigned Projects <div id="projDiv"> <tr>

<td >
<select id="Project" multiple="multiple" name="Project">

</select>
</td>


<div id="projDiv">
<td >
<select id="to_select_list" multiple="multiple" name="to_select_list">

</select>
</td>

</tr>

<tr>

<td><input id="moveright" type="button" value="Move Right" onclick="move_list_items('from_select_list','to_select_list');" /></td>


<td><input id="moveleft" type="button" value="Move Left" onclick="move_list_items('to_select_list','from_select_list');" /></td>



</tr>
</div>
</table>
<!--inner table end-->


<tr><td>




<table border=0 >
<tr>
<td> <center>
<!-- <input type="button" class="submit" value="Save As Draft" onclick="javascript:submitForm('Draft');"/>   -->
<input type="button" class="submit" value="Submit" onclick="javascript:submitForm('submit');" id="submitId"/></center></td>

</tr>
</table>
</td></tr>
</table>
</div></center>


</html:form>
</BODY>
</html>


now i select department in drop down the department based on active project and inactive project displayed two list box nowl only all project displayed one list box.i want separate two list box active and in active how to ajax url?here only stored var projResult = getAjaxResult(ajaxUrl); all active inactive projects...please anyone solve the issue?
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic