Change ID attribute of HTML element dynamically [closed]

Question

I have a table ... I want to change its id when the page is coming back to client .. JSP or servlet and Javascript

<table id="myTable" border="1px" style="font-size: 10px;width: 200px; font-size: 10px; float :left;" >

I want to change its id with mytable2 on page post back

<table id="myTable2" border="1px" style="font-size: 10px;width: 200px; font-size: 10px; float :left;" >

I also want to use ajax but I don't know about ajax, so how can I do this?

Answer 1

You can try this:

<script type="text/javascript">
  function changeHtmlElementId ()
  {
     var htmlElement = document.getElementById("monkey");
     htmlElement.id = "newId";  // here you can assign new Id

 }
</script>

But why are you doing this, Changing Ids of Element is not a good habit. Might it will cause problem with all your Javascript file.

AJAX Example:

function doAjaxPost() { // get the form values var name = $('#name').val(); var passowrd= $('#passowrd').val();

$.ajax({
    type: "POST",
    url: "yourjsp.jsp",
    data: {
      name:name,
      pass: passowrd

    },
    success: function(response){
        // we have the response , do all your stuff here

         alert('Error: ' + e);
     },
     error: function(e){
         alert('Error: ' + e);
     }
});

}

you also need jQuery for this code.