chargement de plugin dans UI DIALOG
Bonjour.
Voilà j'ai un petit problème.
Je charge une page dans un formulaire modal de jqueryui. Cette page contient un plugin jquery Token-Input, qui sert à utiliser des tags.
Seulement ce plugin ne fonctionne pas, car ma page a été chargée en ajax.
Y a t'il une astuce dans ce genre de situation ?
code html :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81
| @model LivDevis.Models.ProductModel
@using LivDevis.Helpers
@using LivDevis.Models
@{
List<UnitOfMeasurementModel> Units = ViewBag.Units;
UnitOfMeasurementModel SelectedUnit = Units.Where(u => u.UnitOfMeasurement_IsDefault == true).FirstOrDefault();
}
@Styles.Render("~/Content/tokeninput", "~/Content/_Authentificated/Product/Create")
@Scripts.Render("~/bundles/jqueryval", "~/bundles/tokeninput", "~/bundles/_Authentificated/Product/Create", "~/bundles/_Common/Form")
<section id="info_popup">
@using (Html.BeginForm("CreateProduct", "Product", FormMethod.Post, new { autocomplete = "off", @id = "CreateProduct" }))
{
@Html.ValidationSummary(true)
<fieldset>
<legend>@LivDevis.Resources.Views.Product.CreateProduct.AboutProduct</legend>
<article>
<div class="editor-field">
@Html.TextBoxFor(model => model.Product_Reference, new { PlaceHolder = LivDevis.Resources.Models.ProductModel.DisplayReference })
@Html.ValidationMessageFor(model => model.Product_Reference)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.Product_Name, new { PlaceHolder = LivDevis.Resources.Models.ProductModel.DisplayName })
@Html.ValidationMessageFor(model => model.Product_Name)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Product_Description)
</div>
<div class="editor-field">
@Html.Partial("DevExpress.CreateProduct.Product_DescriptionPartial", Model)
<span class="field-validation-state"><b id="Product_Description_contentLength"></b> caractère(s) restant(s)</span>
@Html.HiddenFor(model => model.Product_Description)
@Html.ValidationMessageFor(model => model.Product_Description)
</div>
@*<div class="editor-field">
@Html.Action("CategoryProductSimpleList_Partial", "CategoryProduct")
@Html.HiddenFor(model => model.Product_CategoryProductID)
@Html.ValidationMessageFor(model => model.Product_CategoryProductID)
</div>*@
</article>
<article>
<div class="editor-field">
@Html.TextBoxFor(model => model.Product_DefaultQuantity, new { PlaceHolder = LivDevis.Resources.Models.ProductModel.DisplayDefaultQuantity })
@Html.ValidationMessageFor(model => model.Product_DefaultQuantity)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Product_Unit)
</div>
<div class="editor-field">
@Html.DropDownListFor(model => model.Product_UnitID, new SelectList(Units, "UnitOfMeasurement_UnitID", "UnitOfMeasurement_Name", SelectedUnit.UnitOfMeasurement_UnitID))
@Html.ValidationMessageFor(model => model.Product_UnitID)
</div>
<div class="editor-field">
@Html.TextBox("Product_Tag", null, new { @id = "Product_Tag" })
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.Product_Price, new { PlaceHolder = LivDevis.Resources.Models.ProductModel.DisplayPrice })
@Html.ValidationMessageFor(model => model.Product_Price)
</div>
<div class="editor-field">
@Html.TextBoxFor(model => model.Product_Tax, new { PlaceHolder = LivDevis.Resources.Models.ProductModel.DisplayTax })
@Html.ValidationMessageFor(model => model.Product_Tax)
</div>
</article>
</fieldset>
}
</section> |
voici ma fonction permettant le chargement d'une popup :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43
| function DisplayPopup(Title, Url, Width, Height, DisplayDoAgain, OnSubmit_Callback) {
var ModalDialog = $("div#dialog-form");
ModalDialog.dialog({
title: Title,
width: Width,
height: Height,
modal: true,
show: 'fade',
hide: 'fade',
buttons: {
"Valider": function () {
var IsValid = OnSubmit_Callback();
if (IsValid) {
ModalDialog.dialog("close");
}
},
"Valider et recommencer": function () {
alert("fonction non implémentée");
//OnSubmit_Callback();
},
"Annuler": function () {
$(this).dialog("close");
}
},
open: function (event, ui) {
var ValidAndRestartButton = $("button.ui-button").eq(1);
if (!DisplayDoAgain) {
ValidAndRestartButton.hide();
}
},
close: function () {
var allFields = ModalDialog.find(".ui-buttonset, input[type=file], input[type=hidden], input[type=password], input[type=text], textarea, select");
allFields.val("").removeClass("ui-state-error");
}
})
.html("<div class=\"loading\"></div>")
.dialog("open")
.load(Url);
} |
voici une extrait de mon code js (à l'endroit où j'utilise mon plugin) :
Code:
1 2 3 4 5 6 7 8 9 10 11
| $(function () {
$(document).ready(function () {
$("input[type=text]#Product_Tag").tokenInput("http://shell.loopj.com/tokeninput/tvshows.php", {
theme: "facebook"
});
});
}); |
J'espère que vous pourrez m'aider svp ! :)