0

我有一个界面,旨在鼓励管理员用户选择它们存在的现有名称条目,然后使其可编辑。

渲染的代码是这样开始的

前

<td class="selectname" colspan="2" style="width: 220px; display: table-cell;">
<select name="PersonSelect" id="PersonSelect" style="font-size:10px">
<option></option>
<option value="123">Aamodt, Jodi</option>
...

并且在进行选择后,选择值被清除并且 TD 被隐藏

<td class="selectname" colspan="2" style="width: 220px; display: none;">

并显示两个新输入:

<td class="entername" style="display: table-cell;"><input type="text" size="12" name="First" id="First" value="" class="required valid"></td>
<td class="entername" style="display: table-cell;"><input type="text" size="12" name="Last" id="Last" value="" class="required valid"></td>

后

出现的问题是,其中一位管理员告诉我,当他在选择菜单中选择一个人时,没有任何变化——例如,文本输入没有出现,选择输入也没有消失。

用户和我都在 Chrome 中访问该页面。用户不是特别技术,但给出的屏幕截图在症状上很清楚。在他的 Chrome 中没有关闭 JavaScript,因为在这些相同的页面加载期间,用户的 JavaScript 验证例程是成功的。用户和我正在加载相同的数据集,因此这不应该是与数据本身相关的损坏问题。

ajax更改功能如下。

有什么建议吗?

$("#PersonSelect").change(function() {
$.ajax({
  url: 'person_form_populater.php?person=' + $("#PersonSelect").val() + '&entity=' + $("#Entity").val(),
   dataType: 'json',
     success: function(data) {
    if (data['found']) {
      alert('There is already a record linking that person to this entity');
      $('#First_' + data['found']).focus();
      var origColor = $('#bmformtable_' + data['found']).css("background-color");
      $('#bmformtable_' + data['found']).css("border", '0px solid #f00');
      $('#bmformtable_' + data['found']).animate({
        borderWidth: 5
      }, 2000, "linear", function() {
        $('#bmformtable_' + data['found']).animate({
        borderWidth: 0
      }, 2000, "linear", function() {

      });
      });
    } else {
      $('#togglelink').click();
      $('#First').val(data['First']);
      $('#Last').val(data['Last']);
      $('#Occupation').val(data['Occupation']);
      if (data['Gender'] == 'Male') {
        $("#Gender").attr('checked',true);
      } else if (data['Gender'] == 'Female') {
        $("#Gender2").attr('checked',true);
      } else {
        $("#Gender").attr('checked',false);
        $("#Gender2").attr('checked',false);
      }
      $('#Race').val(data['Race']);
      $('#Income').val(data['Income']);
      $('#Person').val(data['ID']);
    }
   }
});                
});

// 编辑 此函数允许用户“取消选择”已加载的记录并再次访问选择菜单:

$("#togglelink,#togglelink2").click(function(){
    $('#PersonSelect option').attr('selected', false);
    $('#First').val('');
    $('#Last').val('');
    $('#Occupation').val('');
    $("#Gender").attr('checked',false);
    $("#Gender2").attr('checked',false);
    $('#Race').val('');
    $('#Income').val('');
    $('#Person').val('');
    $(".entername, .selectname, #togglelink, #togglelink2").toggle();                                
});
4

2 回答 2

1

You said there are no errors in the users browser. I think there is an error but you are not seeing it.

log errors in the ajax call by doing the following:

$.ajax({
  ...
}).error(function (data, textStatus, xhr) {
     console.log("error when using ajax" + data);
});
于 2013-02-18T16:58:40.407 回答
1

如果新功能是在现有文件上实现的,则可能是缓存问题。

如果要求用户清除缓存不是一个选项,请尝试将“版本”附加到 javascript:

<script src="/js/yourjavascript.js?20130218" type="text/javascript">

之后的值?不会影响 javascript 但会更改资源的名称,告诉浏览器此文件不在缓存中,因此他必须请求它。

您还可以在控制台上检查服务器响应,以确保服务器在这两种情况下都正确响应。

于 2013-02-18T17:01:51.557 回答