Submitting JSP form data to servlet

Question

I currently have this tree node which was created from http://mbraak.github.io/jqTree/. I am trying to implement this tree, so that when a user clicks on a node in the tree, it will send the data to my servlet. Is there any way to do this? I am currently using JSP. My initial solution was to add a button so that the button (with form tag) will do post action when it is being clicked(after selecting my node), but i would like to know if there is any solution without using a button. I also thought of using ajax but im new to this and am not sure if it works. Really need some help. Thanks My Tree:

$('#tree1').tree({data: data});
    $('#tree1').bind(
             'tree.click',
            function(event) {
                if (event.node) {
                    // node was selected
                        node = event.node.name;
                    alert(node);
                    // send node value to servlet
                }
                else {
                }});

HTML

<div id="tree1"></div>

My Initial idea

  $('#saveCat').click(function(){
        document.getElementById('mainCat').value = node;
        document.getElementById('action').value = "savecategory";
     });


  <form action="TopicCloudServlet">
    <button id="saveCat" class=" catbtn btn-primary">Save</button>
    <input type="hidden" id="mainCat" name="mainCat" value="" />
    <input type="hidden" id="action" name="action" value="" />
  </form>

score 0 · Answer 1 · answered Nov 12 '13 at 01:40

0

Assuming that you are dynamically creating the tree , you can add extra elements as attributes to each nodes of the tree when you render it.Do not worry,your custom attributes will be ignored by the browser.

Below "nodevalue" is your own attribute that you add to the div dynamically when rendering the tree to uniquely identify each node.

<div id="tree1">
   <div nodevalue="node1" class="mynode">
   </div>
  <div nodevalue="node2" class="mynode">
   </div>
</div>

Then write a jquery class selector onclick event and get the unique ID of the clicked node.

$(".mynode").on("click",function(){

    alert(this.attr("nodevalue"));

});

this.attr("nodevalue")

will give the value of the node you currently clicked.

answered Nov 12 '13 at 01:40

Tito

8,894
12
52
86

hi @Tito Cheriachan, sry but maybe i wasnt clear enough. I am able to get the value of the node when i click on it; at the line where alert(node);. What i would like to do is to do a form method after this line to post a form to my servlet – user2541163 Nov 12 '13 at 01:45
You can use ajax POST to submit the value to the servlet.This will get you started http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/ – Tito Nov 12 '13 at 01:48
Correct me if i am wrong but the example u gave makes use of a button to submit a form. What if i would like it to do without the button, like when i click on a node and use the ajax POST. Is it possible? – user2541163 Nov 12 '13 at 01:54
1

Yes it is possible , you don't need a button to submit the form. When you click on the node , you can directly call an ajax with "type" POST and pass the values to the servlet in "data" part of the ajax request. – Tito Nov 12 '13 at 02:01

score 0 · Accepted Answer · answered Nov 12 '13 at 02:12

0

Ok i found 1 solution which is very simple( why didn't i thought of it)

Add an id to the form that is going to be submitted.
At the javascript where u want your form to be submitted,

document.forms["FormID"].submit();

answered Nov 12 '13 at 02:12

user2541163

717
2
7
22

Submitting JSP form data to servlet

2 Answers2