Wie setzen readonly-Eigenschaft der dynamischen textbox mit jQuery?

Ich versuche, füllen Sie ein textbox-von DB-Werten und den ich einstellen will textbox-Wert readonly. Wenn der Benutzer klickt auf ein EDIT-option, legen Sie dann alle Textfelder editierbar. Ich habe versagt, dies zu erreichen. Hier ist mein HTML code:

<html>
  <head> 
    <script>
      $(document).ready(function() {  
        $('#contentid :input').each(function() {
          $(this).attr("disabled",true);
        });

      $('#edit').on('click',function() {
        $('#contentid :input').each(function() {
          $(this).attr('disabled',false);});
        });
     });
   </script>
</head>

<body>
  <div data-role="page" id="viewInformation" data-theme="d" data-add-back-btn="true" data-back-btn-text = "back">
    <div data-role="header" id="headerid" class="ui-bar ui-bar-b">
      <h3></h3> 
    </div>

    <div data-role="content" id="contentid">
      <a href="#" id="saveDBValue" data-role="button" data-mini="true" style="width:60px; height:40px; float:center;">SAVE</a>
      <a href="#" id="edit" data-role="button">EDIT</a>
    </div>
  </div>
</body>

Hier ist mein JavaScript code:

 function getDataofSelectedListItem()
    {
        alert("getDataofSelectedListI");
        clickedListItem = window.localStorage.getItem("clickedValueofList");
        console.log("clicked list item"+clickedListItem);
        //db = window.openDatabase("loginintro", "1.0", "loginintro", 1000000);
        var sqlQuery = 'SELECT * FROM loginTable WHERE username=\''+window.localStorage.getItem("clickedValueofList").trim()+'\';';

        console.log("selected list query:"+sqlQuery);
        db.transaction(function(tx)
        {
          tx.executeSql(sqlQuery,[],successCBofListItem,errorCBofListItem);
        },errorCB,successCB);
    }
    function successCBofListItem(tx,results)
    {   alert("erer");
      if(results != null && results.rows != null && results.rows.length > 0) 
         {  $('#contentid').append('<label>UserName:</label><input content-editable="false" id="name" type="text"   value="'+results.rows.item(0).username+'"/>');
         $('#contentid').append('<label>EMAIL ID:</label><input type="text" value="'+results.rows.item(0).emailid+'"/>');
         $('#contentid').append('<label>Password:</label><input type="text" value="'+results.rows.item(0).password+'"/>');
    }   
    function errorCBofListItem()
    {
        alert("errorCBofListItem");
    }

Was mache ich falsch?

JavaScript in der <head> ist nicht eingewickelt in <script> - tags. War das ein Fehler beim kopieren der code auf Stack Overflow?
ja, das war der Fehler beim kopieren von code?

InformationsquelleAutor Erum | 2013-04-10

5

Müssen Sie Leben für die Erfassung der click-Ereignis
```
$('#edit').live('click',function()
```
Erstellt habe ich eine Beispiel

Beispiel für dynamische Textfelder

Warum wäre das notwendig?
Nicht nötig. und ich sah, dass .auf () - Methode ist ab version 1.7
Sie r, reden über das statische Textfeld seine Arbeit für statische textbox, aber keine Antwort für dynamische textbox
Dies ist, da die $(document).bereit(Funktion() wird ausgeführt wenn die Seite geladen wird, sodass Ihr Anruf zu deaktivieren, das Textfeld hat keinen Einfluss auf neu erstellte Textfelder. müssen Sie fügen Sie das Attribut deaktiviert, wenn Sie erstellen dynamische Textfelder je nachdem, in welchem Modus Sie sich befinden Bearbeiten oder gespeichert
Hinzugefügt ein Beispiel für dynamische Textfelder

InformationsquelleAutor NullPointerException
2

Ich glaube was du suchst ist etwas wie dieses:
```
$('input').prop('readonly',true);
```
Es wurde beantwortet Hier

InformationsquelleAutor Tony
0

Ihren code zu deaktivieren, werden alle input-Felder erfolgt auf DOMReady, die vor Ihrer successCBofListItem ausgeführt wird, d.h. bevor es irgendwelche Eingänge zu deaktivieren. Sie müssen sicherstellen, dass Sie ausgeführt wird, nach.

Als von jQuery 1.6, verwenden Sie .prop('disabled', true) eher als .attr('disabled', true). Darüber hinaus brauchen Sie nicht, Durchlaufen Sie die Auswahl und deaktivieren Sie jede Eingabe idividually, können Sie die Eigenschaft für die gesamte Sammlung:
```
$('#contentid :input').prop('disabled', true)
```
Wenn das, was du eingefügt haben oben ist dein code genau so, wie es in der Anwendung vorhanden ist, dann müssen Sie wickeln Sie Ihr javascript im Kopf in <script>...</script> tags.

Eine komplette Lösung könnte wie folgt Aussehen:
```
function toggleForm(disabled) {
    $('#contentid :input').prop('disabled', disabled);
}

$(function() {
    $('#edit').on('click', function() { toggleForm(false); });
});
```
...
```
function successCBofListItem(tx,results)
{
     if(results != null && results.rows != null && results.rows.length > 0) 
     {
         $('#contentid').append('<label>UserName:</label><input content-editable="false" id="name" type="text"   value="'+results.rows.item(0).username+'"/>');
         $('#contentid').append('<label>EMAIL ID:</label><input type="text" value="'+results.rows.item(0).emailid+'"/>');
         $('#contentid').append('<label>Password:</label><input type="text" value="'+results.rows.item(0).password+'"/>');

         toggleForm(true);
     }
}   
```
In Ihrem successCBofListItem oben Sie scheinen auch zu fehlen }, das habe ich oben berichtigt. Ich habe Links die content-editable Attribut im code oben, falls Sie es für etwas, was an anderer Stelle in Ihrem code, aber es ist nicht für diesen Zweck erforderlich. contenteditable ist für die Bearbeitung von Inhalten, die nicht ein form-element.

ja, das war der Fehler beim kopieren von code?
Sicher, ich vermutete, wie viel. Ignorieren Sie das Teil dann. Der rest der Antwort geht noch.
warten zu versuchen, es trotzdem aber lassen Sie mich knmow, wo diese zu schreiben LOC :Funktion toggleForm(deaktiviert) { $('#contentid :input').prop('disabled', Behinderte); }
es funktioniert perfekt

InformationsquelleAutor David Hedlund

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.