2017-07-16 3 views
0

Ich habe ein jqgrid, wo ich Custom_Element verwendet, um das Display zu formatieren.jqgrid bearbeiten kombinierte Spalten und binden Daten

{ 
      name: 'PDTime', index: 'PDTime', width: 60, editable: true, formatter: timeSpanHMFormatter, edittype: 'text', editoptions: { 
       custom_element: function (value, options) { 
        var elemStr = '<div> <select id="UTTime" name="UTTime" >' 

        for (var i = 0; i < 24; i++) { 
         elemStr = elemStr + '<option value="' + i + '">' + i + '</option>' 
        } 
        elemStr = elemStr + "</select> </div>"; 
        return $(elemStr)[0]; 
       }, 
       custom_value: function (elem, operation, value) { 
        console.log(elem); 

       } 
      } 
     }, 

Der Formatierer ist eine Zeitspannenanzeige, die Stunden und Minuten zeigt. Der Wert 'PDTime' ist ein Objekt mit den Eigenschaften Stunden und Minuten.

function timeSpanHMFormatter(cellvalue, options, rowObject) {   
    if (cellvalue.Hours == 0 && cellvalue.Minutes == 0) 
     return ""; 
    var value = "00:00"; 

    if (cellvalue.Hours.toString().length == 1) 
     value = "0" + cellvalue.Hours 
    else 
     value = cellvalue.Hours 

    if (cellvalue.Minutes.toString().length == 1) 
     value = value + ":0" + cellvalue.Minutes 
    else 
     value = value + ":" + cellvalue.Minutes 

    return value; 
} 

Im Ansichtsmodus sieht die Zelle wie 02:30 usw. aus, abhängig vom Wert. Ich möchte im Bearbeitungsmodus Werte an dieses PDTime-Objekt binden, und ich bin nicht sicher, wie es geht.

Das custom_element erstellt eine Stunde Drop-Down für jetzt und ich versuche, den Drop-Down ausgewählten Wert in PDTime.Hours zu binden. Wie kann ich das machen ?

+0

Upps, EditType: ‚custom‘ nicht 'Text' in der Frage. – user3462433

+0

Könntest du detaillierter darüber sein, was du meinst mit: "Binde Werte an dieses PDTime-Objekt im Bearbeitungsmodus" .. Welches Bearbeitungsmodul wird verwendet - Inline, Zelle von fordedit? –

+0

Ich verwende Inline-Bearbeitung. Und bind ich meine, wenn ich Werte für den PDTime gebe, möchte ich in der Lage sein, es PDTime.hours und Minuten zuzuweisen. Wenn ich zum Beispiel in den beiden Dropdown-Menüs zwei Werte auswähle, bindet man sich an PDTimr.hours und andere an Minuten. Wenn ich also beim Speichern zurücksende, kann ich auf das PDTimr-Objekt zugreifen. – user3462433

Antwort

0

Wie aus der Guriddo Documentation here für das benutzerdefinierte Element zu sehen ist, ist es erforderlich, eine custom_value-Funktion mit Operation zu definieren, um zu erhalten.

Der Trick hier ist, dass dieses Ereignis Objekt zurückgeben sollte, wenn die Operation ausgeführt wird. Unten finden Sie eine exsmple:

custom_value: function (elem, oper) { 
    if(oper==='get') { 
     var hour = $("#UTTime", elem).val(); 
     // get the minutes according to your definition 
     var time = $("#UTTime", elem).val(); 
     return {"Hours" : hour, "Minutes": time}; 
    } 
}, 

Beachten Sie, dass, wenn die Daten an den Server PDTime gebucht wird ein Objekt ist. Sie können die Post vereinfachen man einen oder mehrere Werte Rückgabe des serializeRowData Ereignis mit (look here) Diese Veranstaltung ist jqGrid Ereignis und man kann es wie folgt tun:

...jqGrid({ 
.... 
    serializeRowData : function(postdata) { 
     var hours = postdata.PDTime.Hours; 
     var minutes postdata.PDTime.Minutes; 
     posdata.PDTime = hours+":"+minutes; 
     // or what you want data combination 
     return postdata; 
    }, 
...