Of Stack

Summary of the use of forms in JS

  • 2020-03-30 01:20:18
  • OfStack

1. Javascript method to refresh the page
         
Window. The location. Reload ();

Refresh the parent window with the popup window that pops up using window.open()
      Window. Opener. Location. Reload ()

Use the mode window that pops up in window.showdialog
      Window. DialogArguments. Location. Reload ();

2. Two ways to implement javascript pop-up Windows -- here are two examples of pop-up screen centered Windows
Window. The open () method 


       function ShowDialog(url) { 
           var iWidth=300; //Window width
           var iHeight=200;//Window height
           var iTop=(window.screen.height-iHeight)/2;
           var iLeft=(window.screen.width-iWidth)/2;
           window.open(url,"Detail","Scrollbars=no,Toolbar=no,Location=no,Direction=no,Resizeable=no,
     Width="+iWidth+" ,Height="+iHeight+",top="+iTop+",left="+iLeft); 
          }

Window. ShowModalDialog way 

     function ShowDialog(url) { 
           var iWidth=300; //Window width
           var iHeight=200;//Window height
           var iTop=(window.screen.height-iHeight)/2;
           var iLeft=(window.screen.width-iWidth)/2;
           window.showModalDialog(url,window,"dialogHeight: "+iHeight+"px; dialogWidth: "+iWidth+"px;
     dialogTop: "+iTop+"; dialogLeft: "+iLeft+"; resizable: no; status: no;scroll:no");
         }

Notice the second parameter here, window

3. Set the method of not caching data in the page

Add the following statement   to the JSP page; 


<%
      response.setHeader("Pragma","No-Cache");
      response.setHeader("Cache-Control","No-Cache");
      response.setDateHeader("Expires", 0);
%>

4. Ways to close a page without prompting 

function CloseWin(){ 
    var ua = navigator.userAgent; var ie = navigator.appName=="Microsoft Internet Explorer"?true:false; 
    if(ie){
 var IEversion = parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE ")))); 
    if( IEversion< 5.5){
    var str = '';
    document.body.insertAdjacentHTML("beforeEnd", str);
     document.all.noTipClose.Click(); 
   } else {
      window.opener =null; window.close();
   }
  }else{ 
  window.close() 
  }
}

5, regularly close the pop-up window -- set/clear the timer 

scriptlanguage="JavaScript" 
!-- 
functioncloseit(){ 
setTimeout("self.close()",100000)//This is in milliseconds. This is 100 seconds
setInterval("self.close()",100000)
window.clearTimeout(me.timer); 
window.clearInterval(me.timer); 
/script

6. Javascript pop-up child window to pass the value -- through the url to pass the value 

<script language="javascript" type="text/javascript">
function fn_modify(pid){
    var ModifyInfo=new Object();
 window.showModalDialog("modify_main.asp?pid="+pid,ModifyInfo,"dialogHeight:180px;dialogWidth:300px;dialogLeft:;dialogTop:;resizable:off;center:on;help:off;scroll:off;status:off")
 Reload();
}
function Reload(){location.href="abc.asp";}
</SCRIPT> 
<a href="abc.asp" onClick="fn_modify(' This is the value ')"> Click on the </a>

7. Js hide/show form
Document. All (" id "). Style. The display = = "none"; / / hide
Document. All (" id "). Style. The display = = ""; / / show
Document. The getElementById (" bt ") style. The display = = "none"
Document. The getElementById (" bt ") style. The display = = ""
Id is the table, the id of the input

8. Js controls the form element to be valid/invalid
Document. The getElementById (" bt "). The disabled = true;
Document. All (" Submit1 "). The disabled = true; / / failure
Document. All (" Submit1 "). The disabled = false; / / effective

Sets/gets the value of the element
Document. GetElementById (" labTitle "). The innerHTML = "IP mode"; / / set the value
Document. The getElementById (" labTitle "). The innerHTML / / get the value
LabTitle is div, span, id of table

Example 1: 

<input id="mytext" type="text" value=" I can't use it ">
<input type="button" value="disabled" onClick="javascript: document.all.mytext.disabled='false'">
<input type="button" value="enable" onClick="javascript: document.all.mytext.removeAttribute('disabled')">

Example 2: 

 <input id="mytext" type="text" value=" I can use it ">
<input type="button" value="disable" onClick="if (mytext.disabled==false){ mytext.disabled=true;mytext.value=' I can't use it ';this.value='enable'} else { mytext.disabled=false;mytext.value=' I can use it ';this.value='disable'}">

9. The method of page submitting form through function 


function exit(){
selcardForm.action="/NDHotel/queryTroom.do?method=exitSystem";
selcardForm.submit();
}

10. Iterate over the radio method 

<input id="mode1" type="radio"    name="workMode" value="1" checked>
var radios=document.getElementsByName("workMode");
 var workMode="";
     for(var i=0;i<radios.length;i++){
         if(radios[i].checked==true){
          workMode=radios[i].value;
         }
     }

Add options dynamically to select 

<select id="ddlProvince" name="ddlProvince" onchange="cityResult()">
var prov=document.getElementById("ddlProvince");
        prov.options.add(new Option("--- Please select a ---",""));
    var pArray=zoneIdProvince.split("&");
    for(var i=0;i<pArray.length;i++){
      var idpArray=pArray[i].split("#");
      var sZoneID=idpArray[0];
      var sProvince=idpArray[1];
      prov.options.add(new Option(sProvince,sZoneID));
    }

12. How to use prototype ajax to submit data in the page (Java)

Step: in < Head> < / head> Add the following link to the js file 


<head>
<script language="JavaScript" src="/NDHotel/js/prototype-1.6.js"></script>
</head>

Step 2: place the prototype-1.6.js file in the directory specified by /NDHotel/js/

Three steps: in < The script type = "text/javascript" > < / script> The following call function is declared in 


<script type="text/javascript">
function editIpSegment(){
 var url='/NDHotel/ipsegmentset.do?method=roomChangeNotice';
 var pars = 'startip='+startip+'&endip='+endip+'&lindex='+lindex;

new Ajax.Request( url, {method: 'get', parameters: pars, asynchronous:false,onComplete:editResult});
}
function editResult(result){
    var returnStr = result.responseText;
    if(returnStr =='fail'){
      alert("");
      return false;  
    }
}
</script>

Step 4: implement the background call 

 public ActionForward roomChangeNotice(ActionMapping mapping,
   ActionForm form, HttpServletRequest request,
   HttpServletResponse response) throws Exception {
  String result = "";
  PrintWriter pw = RainPrintWriter.getPrintWriter(response);
  try {
   NotifyServiceTwo.sendMessage(4, 0);
   result = "success";
  } catch (Exception e) {
   logger.error("roomChangeNotice" + e);
  }
  pw.write(result);
  pw.close();
  return null;
 }

13. How to get the value of the form in js: 
document.getElementById("lindex").value
document.all.lindex.value//Lindex must be unique in the page
//Set to get focus
document.getElementById("lindex").focus()
document.all.startip.focus()
//Set to lose focus
document.getElementById("lindex").blur()
document.all.startip.blur()

14. Dynamically add/remove rows from a table 

<table width="100%"  id="tdSearch" name="tdSearch" cellpadding="0" cellspacing="0" align="center">
</table>
//Dynamically generate the rows of the table
var autoId = 0; //Self-incrementing variable & NBSP;
function addRow(value1,value2){       
 var highQuery=document.getElementById("tdSearch"); 
 highQuery.insertRow();
 var newRow = highQuery.rows[highQuery.rows.length - 1];  
 newRow.id = "row_" + autoId; 
 newRow.insertCell(); 
 newRow.cells[0].innerHTML = "<input width='200' value='"+value1+"' onchange='changeip("+autoId+")' type='text' id='bIPFrom_"+autoId+"'>-";

 newRow.insertCell(); 
 newRow.cells[1].innerHTML = "<input width='200' value='"+value2+"' type='text' id='bIPTo_"+autoId+"'> ";      

   var cell2 = newRow.insertCell(); 
 cell2.innerHTML = "<input  class='btn_1word' type='button' class='HQ_BUTTON' value='-' onClick=removeRow('" + newRow.id + "')>";
       cell2.setAttribute("class", "yellowCell2"); 
 autoId=autoId+1;
}
function removeRow(rowId){
 var trRow = document.getElementById(rowId);
  //alert(trRow);
 //if(rowId!="row_0"){
  trRow.removeNode(true);
 //}
}

Collection of 15. 

//Displays the import progress bar
document.all("btnImport").disabled=true;
document.all("DataGrid_WaitDiv").style.left=100;
document.all("DataGrid_WaitDiv").style.top=295;
document.all("DataGrid_WaitDiv").style.display = "";
form1.action="/NDHotel/jsp/systemset/roomSet/uploadFile.jsp";
form1.submit();
16. Create a new window 
function layer1AddGroup() {
var url='/NDHotel/jsp/systemset/roomSet/addGroup.jsp';
var newwin=window.showModalDialog(url,window,"dialogWidth=470px;dialogHeight=400px;scroll=yes;status=no;help=no;");
}
//Refresh the parent page
function roomMainLeftRightFrame(){
var layer='<%=layer%>';
window.parent.parent.frames('view').location.href="/NDHotel/troom.do?method=roomSetLeftMenu&layer="+layer; 
}

17. Set the read-only property of the text box/set the color of the text box/set the radio selection 

document.all("txt_AutoTime").readOnly=true;
document.all("txt_AutoTime").style.backgroundColor="#d0d0d0";
runParamSetForm.radNotForcibly.checked=true;

//IP address verification
function ipCheck(ipValue){
 var reg = /^/d{1,3}(/./d{1,3}){3}$/;
 if(ipValue != ""){
  if (reg.test(ipValue)){
   var ary = ipValue.split('.');
   for(key in ary){
    if (parseInt(ary[key]) > 255 )
     return false;
   }
   return true;
  }else
 return false; 
 }else
 return true; 
}

Related articles: