Obtention de balises créées dynamiquement (jQuery) à partir d'ASP.NET

Question

J'ai une page Web dans ASP.NET. J'ai créé le contrôle Tree View avec jQuery. Je fais glisser des objets de l'arbre et les laisse tomber dans l'élément div.

<div id="rows" runat="server" class="droppable"> 
</div> 

J'ajoute des éléments à cette div en utilisant la fonction .append de jQuery.

$(".droppable").append(event.originalTarget.innerHTML); 

Cela fonctionne comme je le veux. Mais maintenant, je veux récupérer tous les éléments supprimés du code ASP.NET. J'utilise le code suivant:

protected void Button2_Click(object sender, EventArgs e) 
{ 
    HtmlGenericControl control = (HtmlGenericControl)Page.FindControl("rows"); 
    Label1.Text = control.InnerHtml; 
} 

Mais cela ne fonctionne pas. J'ai aussi essayé la fonction InnerText, mais toujours rien. J'ai également placé les commandes de bouton et d'étiquette dans UpdatePanel ainsi la page ne s'actualise pas et mon article tombé est toujours dans l'élément div.

Comment puis-je obtenir des éléments ajoutés dynamiquement à partir du code ASP.NET?

Lukas

Answer 1

Votre appel append() modifie simplement la structure DOM. ASP.NET n'a aucune idée que vous avez fait cela.

Vous devez stocker vos modifications dans un champ "état" masqué sur la page, et dans votre code-derrière les retirer.

var droppedItem = event.originalTarget; 
$(".droppable").append(droppedItem.innerHTML); 
$("#myHiddenStateField").get(0).value += "," + droppedItem.id; 

code

derrière:

string[] droppedItemIds = myHiddenStateField.Value.Split(","); 

Answer 2

ASP.NET ne sera en mesure de travailler avec des éléments de formulaire.

Donc, si ces lignes sont par exemple (entrée [type = texte]) vous pouvez faire ceci:

Request.Form["rows"] 

EDIT

Lorsque l'utilisateur fait glisser sur l'élément pourquoi ne pas vous créer une nouvelle entrée cachée et mettre la valeur pertinente à l'intérieur de celui-ci. Cela rendra facile d'obtenir la valeur du serveur avec l'exemple que j'ai utilisé ci-dessus.

Answer 3

mieux encore pourquoi ne pas utiliser la ajax de jquery sur l'événement de succès de largable et enregistrer chaque goutte via PageMethod de asp.net, alors vous ne devez pas traiter avec html parsing intérieur votre élément droppable.

cela devrait vous aider à démarrer

http://encosia.com/2008/05/29/using-jquery-to-directly-call-aspnet-ajax-page-methods/

ici est un exemple réel i utilisé

  $('.droppable').droppable({ 
      accept: '#dragList > li, .columnRight li', 
      activeClass: 'ui-state-highlight', 
      hoverClass: 'hoverBorder', 
      drop: function(ev, ui) { 
       $.ajax({ 
        type: "POST", 
        url: "yourPage.aspx/AddDroppable", 
        data: "{'id':'" + ui.draggable.context.id + "'}", 
        contentType: "application/json; charset=utf-8", 
        dataType: "json", 
        success: function(msg) { 
         $("#Result").html(msg.d); 
        } 
       }); 
      } 
     });