Error : "identifier starts immediately after numeric literal javascript" - javascript

$(obj).replaceWith('<a class="fd-tool-li" onclick="javascript:Like(this, #Model.User.HOCODE.ToString(), #Model.CommentHOCODE.ToString());">' +
'<i class="icon-thumbs-up"></i><span> ' +UserCount+ ' Like this</span>'+
'<a name="Unlike"class="fd-tool-li" onclick="javascript:Unlike(this, #Model.User.HOCODE.ToString(), #Model.CommentHOCODE.ToString());">(Unlike?)</a>' +
'</a>');
Why am I getting this error ?

Simplify your code to avoid quote problems (and improve readibility). Extract the onclick javascript from you replace call :
$(obj).html('<a class=fd-tool-li onclick="javascript:Like(this, #Model.User.HOCODE.ToString(), #Model.CommentHOCODE.ToString());">' +
'<i class="icon-thumbs-up"></i><span> ' +1+ ' Like this</span>'+
'<a name=Unlike class=fd-tool-li>(Unlike?)</a>' +
'</a>'
);
$(obj).click(function() {
// things
});
That's supposing the #Model is defined by a precompiler of some sort and isn't present in the code.

If that's really what your code looks like when it reaches the browser (as opposed to parts of it being handled on the server and something different going to the browser), then you have a syntax error where you have #Model.CommentHOCODE.ToString(). You'll need to fix that. Identifiers can't start with a #.
If instead that's processed server-side and replaced with a series of characters, you probably need to put quotes around it, if it's really a string.
Similarly, do you have a client-side variable called UserCount? Because if not, and if that isn't being processed server-side, that could be an issue as well.
Fundamentally you need to look at that code and establish what happens server-side and what the result is that gets sent to the client browser, then ensure that what gets sent to the client browser is valid.

in my case, I was using an UUID in order to set a complex variable (something + UUID) and an easy solution I did was:
Replace "-" by "", the uniqueness for the identifier keeps alive.
If you are using Razor (ASP.net) instead of doing this: #Model.User.HOCODE.ToString() try with: #(Model.User.HOCODE.ToString())
Regards.

Related

missing ) after argument list, When trying to call JS function onclick

Im trying to add data to a JSON object, stored in session. I do this with a js function:
<section class="products">
#foreach (var prod in Model) {
string path = "~/images/" + prod.ImgURL;
<article>
<a href="#Url.Action("InspectProduct","Products", new {productID = prod.Id})">
<img src="#Url.Content(path)" style="max-width: 75%"></a>
<h3>#prod.Name</h3>
<h4>#prod.Price,-</h4>
<a class="btn-add" style="cursor: pointer;" onclick="addToJSONObject(#prod.Id, #prod.Name, #prod.Price, #prod.Info)">Tilføj til kurv</a>
</article>
}
</section>
Im using MVC hence the "#" from the Viewbag.
When i click the "button" it throws: "Uncaught SyntaxError: missing ) after argument list" on almost every products tag.
It worked fine until i started adding more parameters to the function. Any ideas what could be wrong? I dont seem to be missing any ")" or escapes.
You found a very basic concept called "context switch".
If you look at this line:
"#Url.Action("InspectProduct","Products")"
You'll find the the first " initiates your html attribute context. It should be ended by another ". However there are four " in between serving other purposes. Namely, they start/end a parameter value context.
There is no way for the interpreter to differentiate those ". Thus, the syntax error.
Please read about the problem and how you would fix it in your programming language. Sometimes it is escaping (e.g. \"), sometimes it is using different string literals (e.g. ').
When using Razorviews in ASP.NET MVC, the # will allow you to write c# code directly into HTML. The call to the view-bag data in the foreach-loop is done with:
addToJSONObject(#prod.Id, #prod.Name, #prod.Price, #prod.Info)
However, this will not insert " or '
Therefore the correct way to use model data as a parameter (if string is required):
addToJSONObject('#prod.Id', '#prod.Name', '#prod.Price', '#prod.Info')

HTML Different styles

Can anyone tell me what is the difference between the two styles of html code written below.
return '<div id='suggestionId' class="autocomplete-suggestion">No Message Found</div>';
Vs
var autoCompleteSuggestion;
autoCompleteSuggestion = $('<div/>').attr({id: 'suggestionId'}).addClass('suggestion').html('No Message Found');
return autoCompleteSuggestion;
Results are same, the below mentioned script what kind of scripting is it called. Would like to know more
The first one is hard-coded vanilla javascript. The second one uses the jQuery api to build the string.
Also, your first one uses quotes incorrectly. But it looks like that's not intentional.
First of all your first script wont work because you use
return '<div id='suggestionId' class="autocomplete-suggestion">No Message Found</div>'; //you should use id="suggestionId".
The first code is a javascript code returns a string which contains tags and attributes of a div.
the second code is written in JQuery and returns a string built by JQuery functions.
The result (if there is no syntax error) will be the same.
Neither one of them is just straight HTML.
The first one is vanilla javascript. But should be written like this
return '<div id=' + suggestionId + ' class="autocomplete-suggestion">No Message Found</div>';
Otherwise suggestionId will throw an error and not render the id.
The second one is written using jQuery, but can be modified to be just
return $('<div/>').attr({id: 'suggestionId'}).addClass('suggestion').html('No Message Found');
Both will render the same to the browser.

Adding JavaScript Function with arguments to an element from code behind

Hi Guys I've been dealing with an estrange thing while trying to pass string parameters to a JavaScript function from code behind, this is what I have actually in code behind which is wrong:
thumbnail = "<a href = 'javascript:RemovePirctureDetail(" + field1 + ",'" + tempname + "');' class='label label-default' rel='tooltip'>Remove</a>";
So this is the bad result I'm getting in the browser:
Remove
Meas that for some reason when I try to pass the string parameter, the html comes out bad formatted. The result should looks like this:
Remove
I tried already send the quotation marks like this /' from code behind, it did not work neither. How can I achieve this?
Thanks.
string thumbnail = "Remove";`
You need to use \ to escape the quotes inside, not /..
With javascript attribute I wouldn't use single quote, because it could be messy
Try to change in this way:
thumbnail = "Remove";
PS: Actually, I would NEVER use single quotes with attributes, it will cause an HTML validation error, HTML is not well formed with single quotes for attributes (although with inspection tools you see double quotes.. because inspection tools have the need to work with a well formed HTML, so if you want to see the real HTML of your page, view the source code (generally the option is on right-click on the page)

How to mark certain parts of string to be read as code in JavaScript

I am working on ASP.NET Web Forms application. A lot of my information is stored in XML files on the server side. Via Ajax calls I retrieve some of that data for use in the front end.
The problem is that sometimes I have to write in the XML file some string, part of which should be recognized as JS code. What I mean is for example this:
<Render>
<![CDATA[<center><input type='checkbox' value=" + row[2] + " /></center>]]>
</Render>
Here I get this piece of data from a place in JavaScript where I have array row and I have index [2] but instead showing me the value of the element with this index the debugger shows me that the checkbox value is literally row[2] (not recognized as array).
The way I handle this in JavaScript is:
options.mRender = function (data, type, row) { return options.Render; };
where options.Render is the actual string <center><input type='checkbox' value=" + row[2] + " />.
I made a simple JSFiddle example. The idea is when I write person[0] to get Ivan instead of person[0] which is the result now.
I know that if I add eval() like this - $('#appnd').append(eval(txt)); but I can't figure out how to get use of this in my code since I'm passing the whole markup and not only the variable.
You could try something like this:
function parse(text) {
return text.replace(/[a-z]+\[\d+\]/g,function(exp){return eval(exp);});
}
JSFiddle
It simply takes the input and replaces parts of it that look like array[index] with whatever eval does with it.
This solution does not seem like a good idea to me and I agree that there should be some standard way of doing it (better), but I just can't think of another way of doing it.
Edit: It would probably be more reliable if you could mark the JS code in the XML somehow before it is sent to the client like <center><input type='checkbox' value=" + BEGINJS>row[2]<ENDJS + " /> then your regex wouldn't have to guess wildly at what the JS code will look like.

Write correctly class name inside onclick of HTML element

I have a class named validate['required'] and I need to put it inside
onclick="something();document.getElementById('something').setAttribute('class',here);"
the problem is that I get a syntax error : missing ) after argument list.
As per your comments I guess you are doing:
onclick="something();document.getElementById('something').setAttribute('class','vaildate['required']');"
The string between onclick="..." is parsed by the JavaScript interpreter of the browser.
Of the JavaScript code, this fails:
'vaildate['required']'
because the JavaScript interpreter will think everything between ' and ' will be your class name, so in your case:
vaildate[
Then the interpreter also reads required']' which it does not know how to handle, thus producing an error.
To literally use the ' character without the browser using it as the end, you can escape it by prepending \:
'vaildate[\'required\']'
Do you mean something like this?
onclick="something();document.getElementById('something').setAttribute('class','validate[\'required\']');"

Categories

Resources