jqWindow - Can I use ajax to load only part of the window? - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: ajax, code, content, forum, jqxwindow, new, topic, window

This topic contains 4 replies, has 2 voices, and was last updated by billtepe 10 years, 11 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)

Author

jqWindow – Can I use ajax to load only part of the window? Posts
November 6, 2013 at 7:24 pm jqWindow – Can I use ajax to load only part of the window? #32082

billtepe
Member

I have the following code as the content for a window. Is there any way to use Ajax to update or insert content only into part of the window. If someone enters something in the “CouponHelp” input text box and clicks the button “GetHelp”, I would want to use ajax to query a DB for the coupon code and relevant info into the div with id of coupon info. Any help would be greatly appreciated. (also, if someone can give me some pointers on how to correctly format code when entered into these forum pages) (also, I know html code is far from perfect… just trying to get something going!) Thanks much for help.

<div id=’window’><div>Online Ordering Guide</div>
<div>
<span>Coupon Codes beginning with a number:</span> <br/>
<div>* Can not be used if you have ordered items from the Hot Deals menu section.</div>

<span>Coupon Codes beginning with a letter:</span> <br/>
<div>* Can be used if you have ordered items from the Hot Deals menu section.<br/></div>

<div><div style=”float: left;”><input type=”text” id=”CouponHelp”></div><div><input style=”margin-left: 5px;” type=”button” id=”GetHelp” value=”Get Help” /></div></div>

<div id=”CouponInfo”></div>

</div></div>

November 7, 2013 at 6:51 am jqWindow – Can I use ajax to load only part of the window? #32128
Dimitar
Participant
Hello billtepe,

Here is an example:
```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.summer.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxwindow.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#window ").jqxWindow({ height: 300, width: 300, theme: 'summer' });
            var loadPage = function (coupon) {
                var url = coupon + "Page.htm";
                $.get(url, function (data) {
                    $('#CouponInfo').text(data);
                });
            };
            $("#GetHelp").click(function () {
                var coupon = $("#CouponHelp").val();
                loadPage(coupon);
            });
        });
    </script>
</head>
<body>
    <div id="window">
        <div>
            Online Ordering Guide</div>
        <div>
            <span>Coupon Codes beginning with a number:</span>
            <br />
            <div>
                * Can not be used if you have ordered items from the Hot Deals menu section.</div>
            <span>Coupon Codes beginning with a letter:</span>
            <br />
            <div>
                * Can be used if you have ordered items from the Hot Deals menu section.<br />
            </div>
            <div>
                <div style="float: left;">
                    <input type="text" id="CouponHelp" /></div>
                <div>
                    <input style="margin-left: 5px;" type="button" id="GetHelp" value="Get Help" /></div>
            </div>
            <div id="CouponInfo">
            </div>
        </div>
    </div>
</body>
</html>
```
Please check out the forum topic Code Formatting to learn how to properly format your code in the forum.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/
November 7, 2013 at 4:22 pm jqWindow – Can I use ajax to load only part of the window? #32190

billtepe
Member

Dimitar,

Thanks so much for your help. It is exactly what I needed.

Also, When I start a new topic in the forums, I do not get the same tool bar that I am now seeing as I respond to your post. IE… I don’t see the “{}” option.

When I click on help I see at the bottom that it says if I don’t like the “rich editor” I can change it under the “users” submenu of my profile. I went to the profile and do not see anything about users and I don’t see anything about not using the “rich editor”. Can you tell me what I’m doing wrong?

Thanks again.

Regards,
Bill

November 8, 2013 at 6:12 am jqWindow – Can I use ajax to load only part of the window? #32229

Dimitar
Participant

Hi Bill,

We recommend you to create new topic by going to the bottom of a particular forum page, such as Grid.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

November 8, 2013 at 1:40 pm jqWindow – Can I use ajax to load only part of the window? #32270

billtepe
Member

Oh, OK I see that.

Thanks for your help and have a good day!

Bill
Author

Posts

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

<div id=’window’><div>Online Ordering Guide</div> <div> <span>Coupon Codes beginning with a number:</span> <br/> <div>* Can not be used if you have ordered items from the Hot Deals menu section.</div>

<div id=”CouponInfo”></div>

</div></div>

<div id=’window’><div>Online Ordering Guide</div>
<div>
<span>Coupon Codes beginning with a number:</span> <br/>
<div>* Can not be used if you have ordered items from the Hot Deals menu section.</div>