PHP и JavaScript работают правильно в Internet Explorer и Google Chrome, но не на Samsung Galaxy Android - PullRequest
3 голосов
/ 09 марта 2012

У меня есть веб-приложение на основе php, которое при вводе пользователем значения извлекает данные из базы данных mysql и отображает их без обновления страницы.Очевидно, это делается с помощью javascript.

Это работает на 100% корректно в Internet Explorer, Chrome и т. Д. С мобильных устройств, таких как ежевика и планшеты, форматирование испортилось, когда пользователь вводит данные.см. снимки экрана ниже.

Internet Explorer, структура таблицы остается в тактах: enter image description here

Мобильное устройство (Galaxy Tablet), структура таблицы изменена: enter image description here

пример можно посмотреть здесь

Код для двух задействованных страниц показан ниже.внешний интерфейс - это страница php, которая использует javascript для извлечения и отображения данных из mysql.

страница php:

<html>
<head>
<title>test</title>
<script type="text/javascript"> 
  function showUser(userNumber, str) 
  { 
  document.getElementById("r"+(userNumber)).style.display="block";  
    if (str=="") 
    { 
      document.getElementById("txtHint1").innerHTML=""; 
      return; 
    }   
    if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp=new XMLHttpRequest(); 
    } 
    else 
    {// code for IE6, IE5 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onreadystatechange=function() 
    { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
        document.getElementById("txtHint1").innerHTML=xmlhttp.responseText; 
      } 
    } 
    xmlhttp.open("GET","getdata1.php?q="+str,true); 
    xmlhttp.send(); 
  } 
</script> 
</head>
<body>

<form name="orderform" id="orderform" action="newsale.php" method="post">

<div align="left" id="txtHint1">mysql data will be shown here</div>
<br>
<table border="1">

    <tr id="r1">  
        <td>
            <input size="8"  type="text" id="sku1" name="sku1" onchange="showUser(1, this.value)" >
        </td>
        <td>
            <input  type="text" id="qty1" name="qty1" size="3">
        </td>
    </tr>
    <tr id="r2">  
        <td>
            <input size="8"  type="text" id="sku2" name="sku2" onchange="showUser(1, this.value)" >
        </td>
        <td>
            <input  type="text" id="qty2" name="qty2" size="3" >
        </td>
    </tr>
</table>

</form>
</body>
</html>

getdata1.php страница для извлечения данных mysql:

<?php
 $q=$_GET["q"];

$con = mysql_connect('localhost', 'user', 'pass');
 if (!$con)
   {
   die('Could not connect: ' . mysql_error());
   }

mysql_select_db("database", $con);

$sql="SELECT Category, Description,SellingUnits,Grouping,CasesPerPallet,ShrinksPerPallet FROM skudata WHERE packcode = '".$q."'";

$result = mysql_query($sql);


while($row = mysql_fetch_array($result))
   {
   echo "<font color=blue size=2>Description:</font> <font color=red size=2>".$row['Description']."</font>, ";
   }

mysql_close($con);
 ?> 

Еще раз спасибо за всю помощь, это ценится.

В качестве альтернативы, есть ли у кого-нибудь другой javascript, который они могут дать мне для отображения данных из mysql?извиняюсь, но мои навыки работы с JavaScript не существуют.

Спасибо и С уважением,

1 Ответ

1 голос
/ 13 марта 2012

Проблема в первой строке вашего JavaScript:

document.getElementById("r"+(userNumber)).style.display="block";

Вы устанавливаете стиль отображения первой строки таблицы на block. Я не думаю, что есть причина делать это в вашем случае, поэтому просто удалите строку, и ваш HTML будет хорошо работать во всех браузерах, включая Samsung Galaxy Tab (я тестировал это на реальном планшете).

В качестве примечания, эффект смещения ячеек также произошел в FireFox (и не более).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...