Forum

November 2nd, 2014
A A A
Avatar

Lost password?
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

The forums are currently locked and only available for read only access
sp_Feed Topic RSS sp_Related Related Topics sp_TopicIcon
How to map XML (HTML) data?
02/12/2011
07:53
Avatar
ryurage
New Member
Members
Forum Posts: 2
Member Since:
16/06/2011
sp_UserOfflineSmall Offline

Using jquery selectors in the xml map in the column model, something is not working and no data shows inside the grid. The column headings and actual grid do so I don't know if theres something wrong with my xmlmap. Ideas?

Here's my XML (it's XHTML but it's still valid XML):

<!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>
<title>Test2</title>
<script src="js/jquery-1.5.2.min.js"></script>
<script src="js/jquery-ui-1.8.10.custom.min.js"></script>
<script src="js/dialog.minimize.js"></script>
<link href="css/redmond/jquery-ui-1.8.10.custom.css" type="text/css" rel="Stylesheet"/>

<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

</head>
<body>

<div style="display: block; z-index: 1014; outline: 0px none; position: absolute; height: auto; width: 1009px; top: 141px; left: 0px;" class="ui-dialog ui-widget ui-widget-content ui-corner-all disposable ui-draggable ui-resizable">
        <div class="disposable ui-dialog-content ui-widget-content" style="width: auto; min-height: 0px; height: auto;">
            <div class="ui-jqgrid ui-widget ui-widget-content ui-corner-all" dir="ltr" style="width: 973px;">
                <div class="ui-widget-overlay jqgrid-overlay" style="display: none;"></div>

                <div class="ui-jqgrid-view" style="width: 973px;">
                    <div class="ui-jqgrid-titlebar ui-widget-header ui-corner-top ui-helper-clearfix" style="display: none;">
                        <a class="ui-jqgrid-titlebar-close HeaderButton" style="right: 0px;"></a>
                    </div>

                    <div style="width: 973px;" class="ui-state-default ui-jqgrid-hdiv">
                        <div class="ui-jqgrid-hbox">
                            <table cellspacing="0" cellpadding="0" border="0" style="width: 955px;" class="ui-jqgrid-htable">
                                <thead>
                                    <tr class="ui-jqgrid-labels">
                                        <th class="ui-state-default ui-th-column ui-th-ltr" style="width: 20px;">
                                            <div>
                                                <input type="checkbox" class="cbox" />
                                            </div>
                                        </th>

                                        <th id="account" class="ui-state-default ui-th-column ui-th-ltr ui-state-hover" style="width: 33%;">
                                            <span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize;">&nbsp;</span>

                                            <div class="ui-jqgrid-sortable">
                                                Account
                                            </div>
                                        </th>

                                        <th id="city" class="ui-state-default ui-th-column ui-th-ltr" style="width: 33%;">
                                            <span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize;">&nbsp;</span>

                                            <div class="ui-jqgrid-sortable">
                                                City
                                            </div>
                                        </th>

                                        <th id="state" class="ui-state-default ui-th-column ui-th-ltr" style="width: 33%;">
                                            <span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize;">&nbsp;</span>

                                            <div class="ui-jqgrid-sortable">
                                                State
                                            </div>
                                        </th>
                                    </tr>

                                    <tr class="ui-search-toolbar">
                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;"></div>
                                        </th>

                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;">
                                                <input type="text" name="Account" style="width: 95%; padding: 0px;" />
                                            </div>
                                        </th>

                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;">
                                                <input type="text" name="City" style="width: 95%; padding: 0px;" />
                                            </div>
                                        </th>

                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;">
                                                <input type="text" name="State" style="width: 95%; padding: 0px;" />
                                            </div>
                                        </th>
                                    </tr>
                                </thead>

                                <tbody>
                                    <tr>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="ui-jqgrid-bdiv" style="height: auto; width: 973px;">
                        <div style="position: relative;">
                            <table cellspacing="0" cellpadding="0" border="0" class="ui-jqgrid-btable" style="width: 955px;" id="root">
                                <tbody>
                                    <tr style="height: auto;" class="jqgfirstrow">
                                        <td style="height: 0px; width: 20px;"></td>

                                        <td style="height: 0px; width: 33%;"></td>

                                        <td style="height: 0px; width: 33%;"></td>

                                        <td style="height: 0px; width: 33%;"></td>
                                    </tr>
                                    <tr class="ui-widget-content jqgrow ui-row-ltr">
                                        <td style="text-align: center; width: 20px;"><input type="checkbox" name="jqg_aGrid836590176_1" class="cbox" /></td>
<!--                                         <td class="account"><a class="providerclick" href="/accounts/view/id/0">Entity 1</a></td> -->
                                        <td class="account">Entity 1, Inc.</td>
                                        <td class="city">Worland</td>
                                        <td class="state">WY</td>
                                    </tr>
                                    <tr class="ui-widget-content jqgrow ui-row-ltr">
                                        <td style="text-align: center; width: 20px;"><input type="checkbox" name="jqg_aGrid836590176_1" class="cbox" /></td>
<!--                                         <td class="account"><a class="providerclick" href="/accounts/view/id/1">Entity 2</a></td> -->
                                        <td class="account">Entity 2, Inc.</td>
                                        <td class="city">Rolling Hills</td>
                                        <td class="state">NY</td>
                                    </tr>
                                    <tr class="ui-widget-content jqgrow ui-row-ltr">
                                        <td style="text-align: center; width: 20px;"><input type="checkbox" name="jqg_aGrid836590176_1" class="cbox" /></td>
<!--                                         <td class="account"><a class="providerclick" href="/accounts/view/id/2">Entity 3</a></td> -->
                                        <td class="account">Entity 3, Inc.</td>
                                        <td class="city">Rockland</td>
                                        <td class="state">MA</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                <div class="ui-jqgrid-resize-mark">
                    &nbsp;
                </div>

                <div style="width: 973px;" class="ui-state-default ui-jqgrid-pager ui-corner-bottom" dir="ltr">
                    <div class="ui-pager-control">
                        <table cellspacing="0" cellpadding="0" border="0" style="width: 100%; table-layout: fixed; height: 100%;" class="ui-pg-table">
                            <tbody>
                                <tr>
                                    <td align="left">
                                        <!-- <table cellspacing="0" cellpadding="0" border="0" style="float: left; table-layout: auto;" class="ui-pg-table navtable">
                                            <tbody>
                                                <tr>
                                                    <td class="ui-pg-button ui-corner-all" title="Find records">
                                                        <div class="ui-pg-div">
                                                            <span class="ui-icon ui-icon-search"></span>
                                                        </div>
                                                    </td>
                                                    <td class="ui-pg-button ui-corner-all" title="Reload Grid">
                                                        <div class="ui-pg-div">
                                                            <span class="ui-icon ui-icon-refresh"></span>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table> -->
                                    </td>
                                    <td align="center" style="white-space: pre; width: 263px;"><table
                                        cellspacing="0" cellpadding="0" border="0" class="ui-pg-table" style="table-layout: auto;">
                                            <tbody>
                                                <tr>
                                                    <td class="ui-pg-button ui-corner-all ui-state-disabled"><span
                                                         class="ui-icon ui-icon-seek-first"></span></td>
                                                    <td class="ui-pg-button ui-corner-all ui-state-disabled"><span
                                                        class="ui-icon ui-icon-seek-prev"></span></td><td
                                                    style="width: 4px;" class="ui-pg-button ui-state-disabled"><span
                                                        class="ui-separator"></span></td>
                                                    <td dir="ltr">Page <input type="text" value="0" maxlength="7" size="2" class="ui-pg-input" /> of <span>3</span></td>
                                                    <td style="width: 4px;" class="ui-pg-button ui-state-disabled"><span
                                                        class="ui-separator"></span></td><td
                                                    class="ui-pg-button ui-corner-all"><span
                                                        class="ui-icon ui-icon-seek-next"></span></td>
                                                    <td class="ui-pg-button ui-corner-all"><span
                                                        class="ui-icon ui-icon-seek-end"></span></td><td
                                                    dir="ltr"><select class="ui-pg-selbox"><option selected="selected" value="20">20</option><option value="40">40</option><option value="60">60</option></select></td>
                                                </tr>
                                            </tbody>
                                        </table></td>
                                    <td align="right">
                                        <div class="ui-paging-info" style="text-align: right;" dir="ltr">View 1 - 20 of 323</div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

</body>
</html>

Using jquery selectors in the xml map in the column model, something is not working and no data shows inside the grid. The column headings and actual grid do so I don't know if theres something wrong with my xmlmap. Ideas?

Here's my XML (it's XHTML but it's still valid XML):

    <!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>
<title>Test2</title>
<script src="js/jquery-1.5.2.min.js"></script>
<script src="js/jquery-ui-1.8.10.custom.min.js"></script>
<script src="js/dialog.minimize.js"></script>
<link href="css/redmond/jquery-ui-1.8.10.custom.css" type="text/css" rel="Stylesheet"/>

<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

</head>
<body>

<div style="display: block; z-index: 1014; outline: 0px none; position: absolute; height: auto; width: 1009px; top: 141px; left: 0px;" class="ui-dialog ui-widget ui-widget-content ui-corner-all disposable ui-draggable ui-resizable">
        <div class="disposable ui-dialog-content ui-widget-content" style="width: auto; min-height: 0px; height: auto;">
            <div class="ui-jqgrid ui-widget ui-widget-content ui-corner-all" dir="ltr" style="width: 973px;">
                <div class="ui-widget-overlay jqgrid-overlay" style="display: none;"></div>

                <div class="ui-jqgrid-view" style="width: 973px;">
                    <div class="ui-jqgrid-titlebar ui-widget-header ui-corner-top ui-helper-clearfix" style="display: none;">
                        <a class="ui-jqgrid-titlebar-close HeaderButton" style="right: 0px;"></a>
                    </div>

                    <div style="width: 973px;" class="ui-state-default ui-jqgrid-hdiv">
                        <div class="ui-jqgrid-hbox">
                            <table cellspacing="0" cellpadding="0" border="0" style="width: 955px;" class="ui-jqgrid-htable">
                                <thead>
                                    <tr class="ui-jqgrid-labels">
                                        <th class="ui-state-default ui-th-column ui-th-ltr" style="width: 20px;">
                                            <div>
                                                <input type="checkbox" class="cbox" />
                                            </div>
                                        </th>

                                        <th id="account" class="ui-state-default ui-th-column ui-th-ltr ui-state-hover" style="width: 33%;">
                                            <span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize;">&nbsp;</span>

                                            <div class="ui-jqgrid-sortable">
                                                Account
                                            </div>
                                        </th>

                                        <th id="city" class="ui-state-default ui-th-column ui-th-ltr" style="width: 33%;">
                                            <span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize;">&nbsp;</span>

                                            <div class="ui-jqgrid-sortable">
                                                City
                                            </div>
                                        </th>

                                        <th id="state" class="ui-state-default ui-th-column ui-th-ltr" style="width: 33%;">
                                            <span class="ui-jqgrid-resize ui-jqgrid-resize-ltr" style="cursor: col-resize;">&nbsp;</span>

                                            <div class="ui-jqgrid-sortable">
                                                State
                                            </div>
                                        </th>
                                    </tr>

                                    <tr class="ui-search-toolbar">
                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;"></div>
                                        </th>

                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;">
                                                <input type="text" name="Account" style="width: 95%; padding: 0px;" />
                                            </div>
                                        </th>

                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;">
                                                <input type="text" name="City" style="width: 95%; padding: 0px;" />
                                            </div>
                                        </th>

                                        <th class="ui-state-default ui-th-column ui-th-ltr">
                                            <div style="width: 100%; position: relative; height: 100%; padding-right: 0.3em;">
                                                <input type="text" name="State" style="width: 95%; padding: 0px;" />
                                            </div>
                                        </th>
                                    </tr>
                                </thead>

                                <tbody>
                                    <tr>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="ui-jqgrid-bdiv" style="height: auto; width: 973px;">
                        <div style="position: relative;">
                            <table cellspacing="0" cellpadding="0" border="0" class="ui-jqgrid-btable" style="width: 955px;" id="root">
                                <tbody>
                                    <tr style="height: auto;" class="jqgfirstrow">
                                        <td style="height: 0px; width: 20px;"></td>

                                        <td style="height: 0px; width: 33%;"></td>

                                        <td style="height: 0px; width: 33%;"></td>

                                        <td style="height: 0px; width: 33%;"></td>
                                    </tr>
                                    <tr class="ui-widget-content jqgrow ui-row-ltr">
                                        <td style="text-align: center; width: 20px;"><input type="checkbox" name="jqg_aGrid836590176_1" class="cbox" /></td>
<!--                                         <td class="account"><a class="providerclick" href="/accounts/view/id/0">Entity 1</a></td> -->
                                        <td class="account">Entity 1, Inc.</td>
                                        <td class="city">Worland</td>
                                        <td class="state">WY</td>
                                    </tr>
                                    <tr class="ui-widget-content jqgrow ui-row-ltr">
                                        <td style="text-align: center; width: 20px;"><input type="checkbox" name="jqg_aGrid836590176_1" class="cbox" /></td>
<!--                                         <td class="account"><a class="providerclick" href="/accounts/view/id/1">Entity 2</a></td> -->
                                        <td class="account">Entity 2, Inc.</td>
                                        <td class="city">Rolling Hills</td>
                                        <td class="state">NY</td>
                                    </tr>
                                    <tr class="ui-widget-content jqgrow ui-row-ltr">
                                        <td style="text-align: center; width: 20px;"><input type="checkbox" name="jqg_aGrid836590176_1" class="cbox" /></td>
<!--                                         <td class="account"><a class="providerclick" href="/accounts/view/id/2">Entity 3</a></td> -->
                                        <td class="account">Entity 3, Inc.</td>
                                        <td class="city">Rockland</td>
                                        <td class="state">MA</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                <div class="ui-jqgrid-resize-mark">
                    &nbsp;
                </div>

                <div style="width: 973px;" class="ui-state-default ui-jqgrid-pager ui-corner-bottom" dir="ltr">
                    <div class="ui-pager-control">
                        <table cellspacing="0" cellpadding="0" border="0" style="width: 100%; table-layout: fixed; height: 100%;" class="ui-pg-table">
                            <tbody>
                                <tr>
                                    <td align="left">
                                        <!-- <table cellspacing="0" cellpadding="0" border="0" style="float: left; table-layout: auto;" class="ui-pg-table navtable">
                                            <tbody>
                                                <tr>
                                                    <td class="ui-pg-button ui-corner-all" title="Find records">
                                                        <div class="ui-pg-div">
                                                            <span class="ui-icon ui-icon-search"></span>
                                                        </div>
                                                    </td>
                                                    <td class="ui-pg-button ui-corner-all" title="Reload Grid">
                                                        <div class="ui-pg-div">
                                                            <span class="ui-icon ui-icon-refresh"></span>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table> -->
                                    </td>
                                    <td align="center" style="white-space: pre; width: 263px;"><table
                                        cellspacing="0" cellpadding="0" border="0" class="ui-pg-table" style="table-layout: auto;">
                                            <tbody>
                                                <tr>
                                                    <td class="ui-pg-button ui-corner-all ui-state-disabled"><span
                                                         class="ui-icon ui-icon-seek-first"></span></td>
                                                    <td class="ui-pg-button ui-corner-all ui-state-disabled"><span
                                                        class="ui-icon ui-icon-seek-prev"></span></td><td
                                                    style="width: 4px;" class="ui-pg-button ui-state-disabled"><span
                                                        class="ui-separator"></span></td>
                                                    <td dir="ltr">Page <input type="text" value="0" maxlength="7" size="2" class="ui-pg-input" /> of <span>3</span></td>
                                                    <td style="width: 4px;" class="ui-pg-button ui-state-disabled"><span
                                                        class="ui-separator"></span></td><td
                                                    class="ui-pg-button ui-corner-all"><span
                                                        class="ui-icon ui-icon-seek-next"></span></td>
                                                    <td class="ui-pg-button ui-corner-all"><span
                                                        class="ui-icon ui-icon-seek-end"></span></td><td
                                                    dir="ltr"><select class="ui-pg-selbox"><option selected="selected" value="20">20</option><option value="40">40</option><option value="60">60</option></select></td>
                                                </tr>
                                            </tbody>
                                        </table></td>
                                    <td align="right">
                                        <div class="ui-paging-info" style="text-align: right;" dir="ltr">Vie

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
74 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information