How to send data from a field generated using javascript and ASP.NET to a Microsoft SQL?

Question

I have created a code using Javascript and ASP.NET to generate fields necessary for a survey and I would like to know how to send the text inside the field into a database. Here is my code using ASP.NET to generate the table. My goal is to create a web app like google form that can let non-programmers create a survey.

<div class="form-group" style="margin:auto; width:80%;">
    <form name="add_question" id="add_question">
        <asp:Label ID="Label1" runat="server" Text="Survey Title: " Font-Size="Large"></asp:Label>
        <input type="text" name="title" id="title" class="form-control question_list" placeholder="Enter Survey Title"/>
        <asp:Label ID="Label2" runat="server" Text="Description: " Font-Size="Large"></asp:Label>
        <br>
        <textarea rows="4" style="margin:auto; width:100%; resize: none;" name="description" id="description"  placeholder="Enter description"></textarea>
        <table class="table" id="dynamic_field">
            <thead>
            <tr>
                <th style="width: 50%">Question</th>
                <th style="width: 15%">Type of Question</th> 
                <th style="width: 32%">Fields</th>
                <th style="width: 3%">Remove</th>
            </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </form>
    <button type="button" name="add" id="add" class="btn btn-warning" > Add Question </button>
    <asp:Button name="submit" id="submit" class="btn btn-success" runat="server" Text="Submit" OnClick="submit_Click" />           
 </div>

And here is the code for the javascript that creates new rows in the table and generates the field depending on the question type selected.

//ADD TABLE ROWS
$("#add").click(function () {
        i++;
        $("#dynamic_field tbody").append('<tr id="row' + i + '"> <td> <input type="text" name="question' + i + '" id="question'
        + i + '" class="form-control question_list" placeholder="Enter question"/> </td><td><select name="type' + i + '" id="' + i + '" class="dropdown">'
        + '<option selected></option>'
        + '<option value="1">Multiple Choice</option>'
        + '<option value="2">CheckBox</option>'
        + '<option value="3">Short Sentence</option>'
        + '<option value="4">Paragraph</option>'
        + '<option value="5">Line Scale</option>'
        + '</select></td><td></td><td><button name="remove' + i + '" id="'
        + i + '" class="btn btn-danger btn_remove"> X </button>  </td> </tr> ');
    });
$(document).on('change', '.dropdown', function () {
    var xid = $(this).attr("id");
    if ($(this).val() == '3') {
        $('#myInput' + xid + '').remove();      
        var row = document.getElementById("row"+xid+"");
        var z = row.insertCell(2);        
        z.innerHTML = '<td style="width: 32%"><input name="3" id="myInput' + xid + '" type="text" style="width: 100%" /></td>';
        row.deleteCell(3);
    }
    else if ($(this).val() == '4') {
        $('#myInput' + xid + '').remove();
        var row = document.getElementById("row"+xid+"");
        var z = row.insertCell(2);
        z.innerHTML = '<td style="width: 32%"><textarea rows="2" cols="40" name="4" id="myInput' + xid + '" style="margin:auto; width:100%; resize: none;" ></textarea></td>';
        row.deleteCell(3);
    }
});

Have a look at Jquery $.ajax method for calling cs file methods with parameters api.jquery.com/jquery.ajax — Gagan Deep
– Gagan Deep, Commented May 8, 2018 at 6:27
you can do it by using jQuery AJAX in ASP.Net. For more you can visit URL — Azeem Hafeez
– Azeem Hafeez, Commented May 8, 2018 at 6:33

danish · Accepted Answer · 2018-05-08 06:45:10Z

1

Since you are creating the controls on the client side, server will not know about them. In this scenario, since you as using ASP.Net and have a submit button, the value in the text box and dropdown will indeed be sent back to server in the Request.Forms object. For instance, if you have a textbox with name question1, on the click event handler for submit button, you can try something like this:

Request.Forms["question1"]

This will give you the value in the textbox which is posted back to server.

Note that there are other ways to handle this kind of dynamic scenarios which you may want to take a look at.

answered May 8, 2018 at 6:45

danish

5,6002 gold badges27 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Haakon Over a year ago

I'm new to ASP.Net, can you give me an idea on how to create dynamic scenarios. Thanks

danish Over a year ago

@Haakon Take a look here: aspsnippets.com/Articles/…

Collectives™ on Stack Overflow

How to send data from a field generated using javascript and ASP.NET to a Microsoft SQL?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related