Mangoski
Mangoski

Reputation: 2119

How to bind a content to specific tab id using jquery

I am trying to bind a html page inside the tab using jquery. I have wrote the below coding. I didn't get any error but when I click the tab , the page is empty.

.cshtml page

<div id="my_form" style="width: 1178px; height: 100%; padding: 0px 10px;">
<div id="QuestionTab" style="width: 100%; height: 50%;">
        <ul>
            <li><a id="stepOneQues" href="#Question1">"Q1"</a></li>
            <li><a id="stepTwoQues" href="#Question2">"Q2"</a></li>
            <li><a id="stepThreeQues" href="#Question3">"Q3"</a></li>
        </ul>

 <div id="Question1" style="height: 95%">
                            <h2>tab2</h2>
                        </div>

 <div id="Question2" style="height: 95%">
                            <h2>tab2</h2>
                        </div>

 <div id="Question3" style="height: 95%">
                            <h2>tab2</h2>
                        </div>
</div>
</div>

Script.js

$.ajax({
                url: xxxxxx,
                type: 'POST',
                data: "12345",
                dataType: 'text',
                success: function (successMsg) {
                    $('#Question3', container).html(successMsg);
                },
                error: function () {
                    debugger;
                }
            });

I am trying to bind the content in the 3rd tab. Since I am newbie to this jquery stuff I couldn't figure out the issue.

Thanks in advance

Upvotes: 0

Views: 90

Answers (1)

Axnyff
Axnyff

Reputation: 9964

What is the container variable you're using in your call to $? Do you have try to do

$('#Question3').html(successMsg);

Are you sure your ajax call is actually working/ responding with some data?

Upvotes: 1

Related Questions