Почему jqGrid не заполняется изначально в Chrome - PullRequest
Новая
       29

Почему jqGrid не заполняется изначально в Chrome

0 голосов
/ 17 апреля 2010

У меня есть веб-страница с jqGrid, которая использует am xmlreader для заполнения себя данными, которые выдаются службой RoR. Страница прекрасно загружается в Firefox и Safari. В Chrome, однако, я получаю пустую сетку. Только когда я изменяю порядок сортировки, нажимая на столбцы, он заполняется. 

<html> 
<head> 
    <title>LocalFx</title> 
    <link href="/stylesheets/main.css?1271423251" media="screen" rel="stylesheet" type="text/css" /> 


    <link href="/stylesheets/redmond/jquery-ui-1.8.custom.css?1271404544" media="screen" rel="stylesheet" type="text/css" /> 
    <link href="/stylesheets/ui.jqgrid.css?1265561560" media="screen" rel="stylesheet" type="text/css" /> 
    <script src="/javascripts/jquery-1.3.2.min.js?1259426008" type="text/javascript"></script> 
    <script src="/javascripts/i18n/grid.locale-en.js?1266140090" type="text/javascript"></script> 
    <script src="/javascripts/jquery.jqGrid.min.js?1271437772" type="text/javascript"></script> 



    <script type="text/javascript"> 

        jQuery().ready(function() {
            jQuery("#list").jqGrid({
                xmlReader: {
                    root:"contracts",
                    row:"contract",
                    repeatitems:false,
                    id:"id"
                },
                jsonReader: {
                    repeatitems:false,
                    root:"contracts"
                },
                datatype: 'xml',
                url:'http://localhost:3000/contracts/index/all.xml',
                mtype: 'GET',
                colNames:['User','B/S',  'Currency', 'Amount', 'Rate'],
                colModel :[
                    {name:'user', index:'username', width:100 , xmlmap:'user>username'} ,
                    {name:'side', index:'side', width:100 , xmlmap:'side'} ,
                    {name:'currency', index:'ccy', width:100 , xmlmap:'currency>ccy'} ,
                    {name:'amount', index:'amount', width:100 , xmlmap:'amount'},
                    {name:'rate', index:'rate', width:100 , xmlmap:'exchange-rate>rate'}
                ],
                pager: jQuery('#pager'),
                caption: 'Contracts',
                sortname: 'side',
                sortorder: "asc",
                viewrecords:true,

                rowNum:10,
                rowList:[10,20,30]
            });
            $("#list").trigger("reloadGrid")
        });
    </script> 


</head> 
<body> 

<table id="list" align="center" class="scroll"></table> 
<div id="pager" class="scroll" style="text-align:center;"></div> 

</body> 
</html>

Это xml: 

<contracts type="array"> 
  <contract> 
    <amount type="float">1000.0</amount> 
    <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
    <currency-id type="integer">488525179</currency-id> 
    <id type="integer">18277852</id> 
    <side>BUY</side> 
    <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
    <user-id type="integer">830138774</user-id> 
    <exchange-rate> 
      <contract-id type="integer">18277852</contract-id> 
      <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
      <denccy-id type="integer">890731696</denccy-id> 
      <id type="integer">419011264</id> 
      <numccy-id type="integer">488525179</numccy-id> 
      <rate type="float">1.3</rate> 
      <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
    </exchange-rate> 
    <user> 
      <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
      <id type="integer">830138774</id> 
      <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
      <username>John Doe</username> 
    </user> 
    <currency> 
      <ccy>EUR</ccy> 
      <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
      <id type="integer">488525179</id> 
      <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
    </currency> 
  </contract> 
  <contract> 
    <amount type="float">500.0</amount> 
    <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
    <currency-id type="integer">890731696</currency-id> 
    <id type="integer">716237132</id> 
    <side>SELL</side> 
    <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
    <user-id type="integer">830138774</user-id> 
    <exchange-rate> 
      <contract-id type="integer">716237132</contract-id> 
      <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
      <denccy-id type="integer">890731696</denccy-id> 
      <id type="integer">861902380</id> 
      <numccy-id type="integer">488525179</numccy-id> 
      <rate type="float">1.3</rate> 
      <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
    </exchange-rate> 
    <user> 
      <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
      <id type="integer">830138774</id> 
      <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
      <username>John Doe</username> 
    </user> 
    <currency> 
      <ccy>GBP</ccy> 
      <created-at type="datetime">2010-04-16T13:59:40Z</created-at> 
      <id type="integer">890731696</id> 
      <updated-at type="datetime">2010-04-16T13:59:40Z</updated-at> 
    </currency> 
  </contract> 
</contracts>

Ответы [ 4 ]

2 голосов
/ 17 апреля 2010

Извините, но как вы можете проверить на http://www.ok -soft-gmbh.com / jqGrid / XmlTest / xmlorg.htm ваш оригинальный код работает нормально в Chrome («4.1.249.1045 (42898)» или "5.0.342.9 бета"). Я не включаю main.css, потому что вы не публикуете его.

Я мог бы сказать, что линия 

$("#list").trigger("reloadGrid")

(без точки с запятой, кстати) можно удалить. И таблица jqGrid и div страницы могут быть уменьшены до 

<table id="list"></table>
<div id="pager"></div>

(см. http://www.ok -soft-gmbh.com / jqGrid / XmlTest / xml.htm ), но все это вам не очень помогает. Мой совет:

  • использовать текущую версию jqGrid (3.6.4)
  • убедитесь, что вы проверяете все необходимые вам части jqGrid при загрузке свернутой версии jqGrid с http://www.trirand.com/blog/?page_id=6. Если вы не уверены - отметьте все. Или используйте последнюю версию из GitHub (особенно если вы используете jQuery 1.4.x), если для вас подходит несжатая версия jqGrid.

Я думаю, что ваша ошибка из-за использования неверно свернутой версии jqGrid (без некоторых частей, которые вам действительно нужны). Еще одна менее вероятная ошибка - ваш файл main.css.

С наилучшими пожеланиями

0 голосов
/ 10 июня 2011

Я использую jquery 1.5.2 и jqgrid 4.0. Аналогичная проблема возникает в Chrome 5.0.396.0, но другие версии Chrome и IE / FF работают хорошо.

Я также тестировал с jquery 1.4.4, эта проблема все еще существует. Но когда я тестировал с jquery 1.3.2, проблема была решена.

0 голосов
/ 20 апреля 2010

потому что мой комментарий мой ответ не так легко увидеть, я разместил ту же информацию, что и второй ответ:

Это очень странно! Я только что скачал jqGrid со всеми выбранными флажками еще раз и изменил xmlorg.htm, чтобы использовать минимальную версию jquery-1.3.2: все работает. Итак, последнее предложение: вы загружаете все файлы, которые я использовал с http://www.ok -soft-gmbh.com / jqGrid / XmlTest / XmlTest.zip . Затем распакуйте, разместите все на веб-сайте, например, на своем локальном хосте (IIS). Исправьте URL для all.xml и откройте xmlorg.htm или xml.htm с вашего веб-сайта. Это должно работать!

0 голосов
/ 17 апреля 2010

Вместо вызова $("#list").trigger("reloadGrid") после инициализации объекта сетки, попробуйте вызвать его из loadComplete, который вызывается после загрузки данных с URL: 

jQuery("#list").jqGrid({
    ...
    rowList:[10,20,30],
    loadComplete: function(){
        ("#list").trigger("reloadGrid")
    }
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...