Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Sep 2005
    Posts
    535
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Problems with nested strings

    I have a menu-driven assembly system that is supposed to create a "page" that includes a picture and instructions for the current step in the build-process as well as a mini-form where a person will enter in info. (eg the part's P/N) and the web-application will use AJAX to log the data in a MySQL DB.

    Right now I have made two variants on this; the first has an 'OK' button in the mini-form which gets logged as the person completing the current step, and the second has a text-box that the user enters in the P/N for a part being installed.

    The problem I am having is with the latter version. To make the page, I am using an innerHTML string, the onchange function in the mini-form's text-box also calls a string, and the function that onchange calls uses two strings as parameters; thus the whole line has three nested strings. The AJAX function has the server-script address as the first param. and the return function as the second. When calling the server-script address, one GET param. references the current menu being made while another references the text-box; thus I am trying to break out of the corresponding string to get the correct value (and thus two different meanings to 'this' reference). But when I try running the program, I keep getting an error of unterminating string right after "value=". Note that the code works fine for the 'OK' part, just not the 'PN' so if possible, I'd like to keep the innerHTML format, but if not I think I can do a work-around using pure DOM... Here's my code:
    Code:
    myMenu.prototype.makePage=function(imgSrc, instText, funct)
    {
    	var htmlString="";
    	htmlString += "<img id='windowImg' src='"+imgSrc+"' />";
    	instText = instText.replace(/\n/g, "<br />");
    	htmlString += "<div id='windowTxt'>"+instText+"</div>";
    	htmlString+="<div id='windowForm'>";
    
    	switch(funct)
    	{
    		case "ok":
    			//htmlString += "<input type='button' value=' OK ' onclick='callToServer(\"/Functions/logBuild.php?step="+this.menuName+"&funct=OK\");' />";
    			//htmlString += "<input type='button' value=' OK ' onclick='showNext(\""+this.menuName+"\");' />";
    			htmlString += "<input type='button' value=' OK ' onclick='ajaxRequest(\"/Functions/logBuild.php?step="+this.menuName+"&funct=OK\", \"JSON\");' />";
    		break;
    		case "pn":
    			htmlString += "<label for='inputBox'>Enter in the Part Number: "+
    				"<input type='text' id='pnInputBox' name='pnInputBox' onchange='ajaxRequest(\"/Functions/logBuild.php?step="+this.menuName+"&funct=PN&value='+this.value+'\", \"JSON\");' /></label>";
    		break;
    		case "sn":
                            //Need to do...
    			htmlString += "";
    		break;
    	}
    	htmlString+="</div>";
    
    	this.pageHTML.innerHTML = htmlString;
    }
    If you want answers, write a smart question.

    Yes, someone probably does know how...

    Oh, and if you want to learn, STFW!

  • #2
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Try this and see if it does any better.

    Code:
            htmlString += "<label for='inputBox'>Enter in the Part Number: " +
                          "<input type='text' id='pnInputBox' name='pnInputBox' " +
                          "onchange='ajaxRequest(\"/Functions/logBuild.php?step=\"+this.menuName+\"&funct=PN&value=\"+this.value, \"JSON\");'" +
                          " /></label>";
    here was my test code

    Code:
    <html>
      <head>
        <title>Test</title>
        <script type="text/javascript">
          var htmlString = "";
    
          function ajaxRequest(s1, s2) {
            document.getElementById("adiv").innerHTML = s1;
            document.getElementById("bdiv").innerHTML = s2;
          }
    
          function init() {
            htmlString += "<label for='inputBox'>Enter in the Part Number: " +
                          "<input type='text' id='pnInputBox' name='pnInputBox' " +
                          "onchange='ajaxRequest(\"/Functions/logBuild.php?step=\"+this.menuName+\"&funct=PN&value=\"+this.value, \"JSON\");'" +
                          " /></label>";
            document.getElementById("fdiv").innerHTML = htmlString;
          }
          window.onload = init;
        </script>
      </head>
      <body>
        <form name="f" action='#' onsubmit="window.focus(); return(false);">
          <div id="fdiv"> </div>
        </form>
        <div id="adiv"> </div>
        <br />
        <div id="bdiv"> </div>
      </body>
    </html>
    david_kw

  • #3
    Regular Coder
    Join Date
    Sep 2005
    Posts
    535
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yep that did it!
    I should've realized... the single quotes surround the javascript, so "this.value" needed to remain inside the single quotes. What I needed to escape out of was the back-slashed quotes around the ajaxRequest()'s parameter strings. I think I had tried something similar with other errors:
    Code:
    "<input type='text' id='pnInputBox' name='pnInputBox' onchange='ajaxRequest(\"/Functions/logBuild.php?step="+this.menuName+"&funct=PN&value=\"+this.value+\", \"JSON\");' /></label>";
    But in this case, I was escaping out of the string to get back into the JS for "this.value" but then errantly put the comma separating the parameters back inside a string and thereby breaking the string structure...

    Thanks for the help... It's always good to have another set of eyes looking at your code!
    If you want answers, write a smart question.

    Yes, someone probably does know how...

    Oh, and if you want to learn, STFW!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •