Replacing (\) baskslash in string with (\\) double backslash

I have strings like the one below that are automatically populated by mobile device management application (MobiControl) when an html page is transferred from my desktop to multiple mobile devices.

What I see on my desktop computer…
link[0] = ‘<MClink1>’;

What the application replaces that with on the mobile device when it is copied…
link[0] = 'file://\Program Files\Wonderware\MobileIntelaTrac\MobileIntelaTrac.exe';

This is what the variable contains when it is used…
file://Program FilesWonderwareMobileIntelaTracMobileIntelaTrac.exe

Is there any way to replace the ‘\’ with a ‘\\’ in JavaScript?  





Open in new window

<script type="text/javascript">

    var label = new Array();
    label[0] = 'Intelatrac';
    label[1] = 'Clock';
    label[2] = 'Align';
    label[3] = 'iDock It';
    label[4] = 'iDock It';

    // Images
    var icon = new Array();
    icon[0] = '%ExeIcon_1%%MCSTABLESTOREDIR%\Lockdownimage\MCLD_Intelatrac.bmp';
    icon[1] = '%ExeIcon_2%%MCSTABLESTOREDIR%\Lockdownimage\MCLD_Clock.bmp';
    icon[2] = '%ExeIcon_3%%MCSTABLESTOREDIR%\Lockdownimage\MCLD_Align.bmp';
    icon[3] = '%ExeIcon_4%%MCSTABLESTOREDIR%\Lockdownimage\MCLD_iDock It.bmp';
    icon[4] = '%ExeIcon_5%%MCSTABLESTOREDIR%\Lockdownimage\MCLD_Calculator.bmp';


    // Links
    var link = new Array();
    link[0] = 'file://\Program Files\Wonderware\MobileIntelaTrac\MobileIntelaTrac.exe';
    link[1] = 'file://\Windows\ctlpnl.exe, cplmain.cpl 16';
    link[2] = 'file://\Windows\ctlpnl.exe, cplmain.cpl 7';
    link[3] = 'file://\Program Files\InVision\iDockIt\iDockIt.exe';
    link[4] = 'file://\Windows\calc.exe';
    
    var i = 0;
    var menu = '<table width = "100%">';
    var col = 1;
    var test = 0;
    
    do {
        if (label[i] != "") {
            if (col == 1) {
                menu = menu + '<tr>';
            }
            menu = menu + '<td align=center height=70px><a href="' + link[i].replace(/\\/g, "\\") + '" STYLE="text-decoration:none;color:black"><IMG border="0" src="' + icon[i] + '"/><br><font >' + label[i] + '</font></a></td>';
            link[i] = link[i].replace(/\\/g,"/");
            if (col == 3) {
                menu = menu + '</tr>';
                col = 0;
            }
            col++;
        }
        else {
            test = 1;
        }
        i++;
    }
    while (test != 1)
    menu = menu + '</table>';
    document.getElementById('menu').innerHTML = menu;



</script>

Open in new window

lawrencebensonAsked:
Who is Participating?
 
thehagmanConnect With a Mentor Commented:
On second thought: If you can influence the insertion positions, why not put the created menu directly into position in the first place?
<div id="menu">
 <table width = "100%">
  <tr>
   <td align=center height=70px><a href="<MClink1>'" STYLE="text-decoration:none;color:black"><IMG border="0" src="'<MCicon1>'"/><br><font ><MClabel1></font></a></td>
   <td align=center height=70px><a href="<MClink2>'" STYLE="text-decoration:none;color:black"><IMG border="0" src="'<MCicon2>'"/><br><font ><MClabel2></font></a></td>
   <td align=center height=70px><a href="<MClink3>'" STYLE="text-decoration:none;color:black"><IMG border="0" src="'<MCicon3>'"/><br><font ><MClabel3></font></a></td>
 </tr>
  <tr>
   <td align=center height=70px><a href="<MClink4>'" STYLE="text-decoration:none;color:black"><IMG border="0" src="'<MCicon4>'"/><br><font ><MClabel4></font></a></td>
   <td align=center height=70px><a href="<MClink5>'" STYLE="text-decoration:none;color:black"><IMG border="0" src="'<MCicon5>'"/><br><font ><MClabel5></font></a></td>
   <td align=center height=70px><a href="<MClink6>'" STYLE="text-decoration:none;color:black"><IMG border="0" src="'<MCicon6>'"/><br><font ><MClabel6></font></a></td>
 </tr>
 </table>
</div>

Open in new window


You might want to add more rows. And if the number of entries is not fixed (as you test against a label becoming "" in your given code) you might want to remove unnecessary td's from the DOM tree per script.

(Apart from this, investing a few thoughts in CSS seems to be a good idea)
0
 
HainKurtSr. System AnalystCommented:
when writing to js file use \\

link[0] = 'file://\Program Files\Wonderware\MobileIntelaTrac\MobileIntelaTrac.exe';

-->

link[0] = 'file://\\Program Files\\Wonderware\\MobileIntelaTrac\\MobileIntelaTrac.exe';
0
 
HainKurtSr. System AnalystCommented:
Is there any way to replace the ‘\’ with a ‘\\’ in JavaScript?  

yes there is, but your initial string does not contain \

try this

alert("Hain\Kurt"); --> HainKurt
alert("Hain\\Kurt");  --> Hain\Kurt
alert("Hain\\\\Kurt");  --> Hain\\Kurt

so when you write your js file, replace \ with \\ outside of js...
0
Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

 
lawrencebensonAuthor Commented:
I am looking for a creative solution if one exists :)

I am aware that it treats the '\' as an escape character.  I have no control over the html file when it is written and I don't want to manage a process of manually updating 100+ mobile devices.
0
 
thehagmanCommented:
For a correct URL, you probably want to replace the (windows file system style separator) "\" with "/" altogether.
A  replace('\', '/')  should do, I think.

However, your source code strings do not contain a backslash at all. Please note that e.g.  '\a\b\c' consists of three characters: The first is a LOWERCASE-A, the sedond is a BACKSPACE, the third is a LOWERCASE-C.
Instead of '\a\b\c' you might equivalently write e.g. 'a\010c' wher the normal letters appear in the usual form and the backspace is encoded inoctal mode instead of the special escape sequence.

What you need is that already the program that generates the above javascript *source* code (especially the string literals in it) must be adjusted to produce useable URLs making the javascript look like
<script type="text/javascript">
 ...
 link[0] = 'file://\\Program Files\\Wonderware\\MobileIntelaTrac\\MobileIntelaTrac.exe';
// or probablybetter yet
 link[0] = 'file:///Program Files/Wonderware/MobileIntelaTrac/MobileIntelaTrac.exe';

Open in new window


However I cannot see how your application produces the Javscript code with its string literals
0
 
thehagmanCommented:
If you do not have any control over the HTML file when it is written, maybe you can interceot it on the way it is transferred to the user agent (e.g. with some kind of specialized "proxy" that rewrites the html code to replace simple with double backslashes within string literals starting with "file://" inside <script> tags?
Without changing the actual javascript source, you cannot do anyting: Within javascript, the boolean expression '\a\b\c' == 'a\010c' evaluates to true
0
 
HainKurtSr. System AnalystCommented:
you have to change the logic that creates this js file (instead of \ you should use \\, replace them before writing the js file, so js will handle them correctly)

similar issue here

http://stackoverflow.com/questions/1376440/javascript-replacing-the-escape-character-in-a-string-literal
0
 
HainKurtSr. System AnalystCommented:
and these are the special characters that you should handle in your app that creates this js file

http://www.w3schools.com/js/js_special_characters.asp
\' single quote
\" double quote
\\ backslash   >>>>>>>>>> this is your issue
\n new line
\r carriage return
\t tab
\b backspace
\f form feed

Open in new window

0
 
lawrencebensonAuthor Commented:
@thehagman

replace('\', '/')  does not work since / is an escape character.  That will throw an error.

The application was not thought out very well, I know, but it is beyond my control.
0
 
lawrencebensonAuthor Commented:
@HainKurt

I am aware of the special characters however I have no control over the application because it is a vendor App.
0
 
HainKurtSr. System AnalystCommented:
ok, if you cannot modify vendor app, then you can modify the file generated before using the file...
with a small utility, or a vbscript, you can open the file, replace \ with \\ and save the file... then use it on browser...
0
 
thehagmanCommented:
I have a somewhat inconventional idea, but it seems that something unconventional is required.
If you cannot influence how the text is inserted, maybe you can influence where it is inserted?
If you can make the text insertions appear outside of javascript source, you may be lucky.
The code below has the same data "\a\b\c" in the HTML source, once it is (as before) part of the javascript source, hence backslash is taken as javascript's escape character. And once it is part of an HTML tag attribute where this escape logic does not apply.
Consequently, the test script below gives two alerts: "The variable A is a string of 3 characters: a<unreadable char representing the backspace>c" and "The variable B is a string of 6 characters: \a\b\c"
If you can adapt your stuff to use this trick, then the strings you obtain are something you can work with (or, may not even need to modify further).

<html>
<head>
   <title>Test page</title>
  <meta id="foo" content="\a\b\c" />
<script type="text/javascript">
function mytest(name, str) {
 alert("The variable " + name + " is a string with " + str.length + " characters: " + str);
}
var A = "\a\b\c";
var B = document.getElementById("foo").content;

mytest("A", A);
mytest("B", B);
</script>
</head>
<body>
</body>
</html>

Open in new window


The downside is ofcourse that other special characters occuring in the inserted text might ruin your page, e.g. double quotes or percent signs.
0
 
lawrencebensonConnect With a Mentor Author Commented:
@Sage - Very close to what I had.

Thanks everyone for your suggestions.  

The solution I had coming into this appears to still be the best solution.  If I store all of the elements in a hidden div block and put my script in the body of the page I can pull all of the element and manipulate them in their current form without having to sorry about the '\' issue.  

The reason I cannot just keep them in html format is that some power users in different regions may customize menus for their business unit.  Those power users may not be familiar with html/javascript so I want the layout to be automated.

I posted what I ended up with.  


<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Program Menu with Icons</title>


<div id="menu"></div>


<div  style="display:none" id="linkblock">
<IMG src="<MCExeIcon0>" id="MCExeIcon0"/>
<IMG src="<MCExeIcon1>" id="MCExeIcon1"/>
<IMG src="<MCExeIcon2>" id="MCExeIcon2"/>
<IMG src="<MCExeIcon3>" id="MCExeIcon3"/>
<IMG src="<MCExeIcon4>" id="MCExeIcon4"/>
<IMG src="<MCExeIcon5>" id="MCExeIcon5"/>
<IMG src="<MCExeIcon6>" id="MCExeIcon6"/>
<IMG src="<MCExeIcon7>" id="MCExeIcon7"/>
<IMG src="<MCExeIcon8>" id="MCExeIcon8"/>
 
<a href="<MCLink0>" id="MCLink0"></a>
<a href="<MCLink1>" id="MCLink1"></a>
<a href="<MCLink2>" id="MCLink2"></a>
<a href="<MCLink3>" id="MCLink3"></a>
<a href="<MCLink4>" id="MCLink4"></a>
<a href="<MCLink5>" id="MCLink5"></a>
<a href="<MCLink6>" id="MCLink6"></a>
<a href="<MCLink7>" id="MCLink7"></a>
<a href="<MCLink8>" id="MCLink8"></a>


<label id="MCDisp0"><MCDisp0></label>
<label id="MCDisp1"><MCDisp1></label>
<label id="MCDisp2"><MCDisp2></label>
<label id="MCDisp3"><MCDisp3></label>
<label id="MCDisp4"><MCDisp4></label>
<label id="MCDisp5"><MCDisp5></label>
<label id="MCDisp6"><MCDisp6></label>
<label id="MCDisp7"><MCDisp7></label>
<label id="MCDisp8"><MCDisp8></label>
</div>
<div style="display:none" id="countblock">
<MCMenuFull> 
</div> 



<script type="text/javascript">

	//<MCExeIcon0>
    //alert(document.getElementById("countblock").getElementsByTagName("a").length);
    var i = 0;
    var menu = '<table width = "100%">';
    var col = 1;
    var test = 0;



    do {

        if (document.getElementById('MCDisp' + i).innerText != "") {
            
            if (col == 1) {
                menu = menu + '<tr>';
            }
            menu = menu + '<td align=center height=70px><a href="' + document.getElementById('MCLink' + i).href + '" STYLE="text-decoration:none;color:black"><IMG border="0" src="' + document.getElementById('MCExeIcon' + i).src + '"/><br><font >' + document.getElementById('MCDisp' + i).innerText + '</font></a></td>';
			
            if (col == 3) {

                menu = menu + '</tr>';

                col = 0;

            }

            col++;
        }

        else {
            test = 1;
        }

        i++;

    }

    while (test != 1)

    menu = menu + '</table>';

    document.getElementById('menu').innerHTML = menu;

</script>
 
 
</body>
 
</html>

Open in new window

0
 
lawrencebensonAuthor Commented:
Thanks everyone.  I had a method of getting what I needed done from the beginning but I like to minimize lines of code where possible.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.