更改動態加載的隱藏表單元素的值

我無法更改通過ajax動態加載的隱藏表單元素的值。當用戶點擊某個日期時，我想讓一些隱藏的輸入字段隨日期，月份和年份自動更新（爲簡化起見，僅在代碼中顯示日期）。更改動態加載的隱藏表單元素的值

我想主要的問題是如何選擇一個已通過ajax動態加載的元素。

簡化代碼：

的index.php

<a href="#" id="someLink">Click Me</a>

include.js

$(document).ready(function(){ 
    $('#someLink').click(function(){ 
     // Create modal dialog dynamically 
     var modal = $('<div/>').attr({ 
      id:'new' + objectName + 'Modal', 
      class:'modal hide fade', 
      tabindex:'-1', 
      role:'dialog', 
     }); 

     // Ajax call to load modal 
     $.ajax({ 
      url: "getModal.php", 
     }).done(function (data) { 
      modal.html(data); 
     }); 

     // show form 
     modal.modal('show');  

     return false; 
    }); 

    // bind datepicker from jQuery UI to text input 
    $("body").on({ 
     focus: function(){ 
      $('.datepicker').datepicker({ 
       onClose: function(dateText, inst) { 
        var inputName = $(this).attr("name"); //returns "startDate" 
        console.log($('#'+inputName+'_day')); // returns "[]" 
        $('#'+inputName+'_day').val(new Date(dateText).getDate()); 
        } 
      }); 
     } 
    },'.datepicker'); 
});

getModal.php

echo <?php 
echo "<form name='modalForm'>"; 
echo "<input type='hidden' name='startDate_day' id='startDate_day'>"; 
echo "<input type='text' class='datepicker' name='startDate' id='startDate'>"; 
echo "</form>"; 
echo ?>

來源

2012-10-09 arcdegree

「inputName」的定義在哪裏？我只能在代碼中找到唯一的用法和定義 –

據我所知，與您的ajax加載無關，這不是重點。您只需像往常一樣選擇DOM元素並進行更改。並且'console.log（'＃'+ inputName +'_ day'）=> []' - 這不是真的，'[]'可以通過jQuery包裝器返回，而不是通過字符串連接器 –

我添加了一行現在顯示inputName來自哪裏。 – arcdegree

我能找到問題的原因，我希望能幫助別人。

我使用Grails/Rails，並自動在ID中放入一個句點字符，我忽略了這一點。後來我試圖使用jQuery來調用名稱中不含有句號的元素（因爲句號是爲類名保留的）。

我確實創建了一個jsfiddle，顯示了此問題成功工作的詳細信息。

來源

2012-10-09 15:33:52 arcdegree

DOM元素的加載方式應該沒有問題，如果存在的話--jQuery會找到它。

你應該name選擇

$('input[name="' + inputName + '"_day"]').val(...);

選擇你的元素，或給你的加載輸入一個id="startDate_day"

來源

2012-10-09 13:32:29

我已經嘗試過使用這個ID。既沒有工作。 – arcdegree

你可以做小提琴嗎？ http://jsfiddle.net/ –

看看我的複製http://jsfiddle.net/YJX8P/1/ –

您可以使用Chrome的控制檯或Firebug的嘗試摘錄如下。

console.log(inputName); 
$('#'+inputName+'_day').val();

必須存在一個名稱的元素，否則jQuery將無法返回任何東西。

就像另一種調試技術一樣，您可以嘗試在頁面查看源中搜索單詞「form」，以查看您所需的表單是否已加載。

來源

2012-10-09 13:42:45

據我瞭解，形式是正確顯示，並有一個日期選擇器，其回調實際上不起作用 –

更改動態加載的隱藏表單元素的值

回答

相關問題