We help IT Professionals succeed at work.

Javascript Virtual HTML

Below js code, everything is working except

document.getElementById("row_" + eventid).style.display = 'none';

When it <a></a> is clicked, I hope to delete or invisible on the selected <div></div>
Do you know what goes wrong?


 function AddQty(eventid,qty,price) {
        var qty_value = document.getElementById(qty).value;
        var price_value = document.getElementById(price).value;
        var eventid_value = document.getElementById(eventid).value;
        
        document.getElementById("qty").value = parseInt(document.getElementById("qty").value) + parseInt(qty_value);
        document.getElementById("totalamount").value = parseFloat(document.getElementById("totalamount").value) + parseFloat(price_value);

        document.getElementById("shoppingcart").innerHTML = document.getElementById("shoppingcart").innerHTML +
       "<div id='row_' " + eventid_value  + " class='col-fs-12'>" +
            eventid_value + " " + qty_value + " " + price_value + " " + "<a style='cursor: pointer;' onclick='Remove(" + eventid_value + ")'>x</a>";
        "</div>";
    }
    function Remove(eventid) {        
        alert('Hi ' + eventid);
        document.getElementById("row_" + eventid).style.display = 'none';
    }

Open in new window

Comment
Watch Question

ZvonkoSystems architect
CERTIFIED EXPERT
Top Expert 2006
Commented:

make the A tag onClick to return: false


Like this:

"< a href='::Remove' style='cursor: pointer;' onclick='Remove(" + eventid_value + ");return false'>x</a>";

Author

Commented:
When it is clicked, I see the alert

Server Error in '/' Application.
A potentially dangerous Request.Path value was detected from the client (:).
Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.Web.HttpException: A potentially dangerous Request.Path value was detected from the client (:).

Source Error:

An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

Stack Trace:


[HttpException (0x80004005): A potentially dangerous Request.Path value was detected from the client (:).]
   System.Web.HttpRequest.ValidateInputIfRequiredByConfig() +9931897
   System.Web.PipelineStepManager.ValidateHelper(HttpContext context) +55
CERTIFIED EXPERT
Most Valuable Expert 2018
Distinguished Expert 2019
Commented:
Couple of problems with your code.

Firstly, you seem to be trying to create the DIV with eventid_value, but then you're trying to select it with just eventid, so you might want to check that.

Secondly, when you're creating the DIV, you have some issues with your quotes:

"<div id='row_' " + eventid_value  + " class='col-fs-12'>"

That will generate HTML that looks something like this:

<div id='row_' xxx class='col-fs-12'>

which is clearly wrong. Try this instead:

"<div id='row_" + eventid_value  + "' class='col-fs-12'>"

Now you'll get HTML that looks like this:

<div id='row_xxx' class='col-fs-12'>

which is probably what you intended.

Author

Commented:
Both of you are very smart. I am very lucky to have your helps.

Author

Commented:
Very helpful & good eye - Chris