Modifica dell'immagine src tramite MVC 3 Azione: jquery, image, asp.net-mvc-3, src

Ho una pagina con un tag immagine. L'immagine visualizzata dal tag immagine cambia in base alla selezione di un'immagine effettuata in una finestra popup. Di seguito sono i passaggi per riprodurre i miei problemi:

 1. Click button on Main Page and display popup with selectable images
2. Click any one image in popup to create selection
3. Click "Associate" button in popup to begin association process
a. JQuery.post is called to "Associate" selected image to image in Main page
i. Code in the Controller is run and save the association in the database.
b. Upon success, the "success" function of the JQuery.post makes a call to an existing javascript function.
i. This function creates a string in the following format: "{Controller}/{Action}/{PrimaryId}/{SecondaryId}"
ii. In the function, the "src" of the image in the main page is set to the string created above.
iii. The change in "src" makes the code in the controller run which in turn returns the specified image.
iv. The popup is closed

Per tutti gli scopi pratici, il codice funzionafatta eccezione per il fastidioso problema che, indipendentemente dal browser, l'immagine non si aggiorna al ritorno dal controller tramite il processo sopra descritto (durante la funzione "Successo" di JQuery.post).

Una cosa da notare è che se i passaggi "b.i" - "b.iv "vengono eseguiti senza" JQuery.post "(ad es. solo per recuperare i dati di immagine senza fare prima un'associazione) l'immagine viene aggiornata ogni volta. Il codice utilizzato è di seguito (redatto - gli elementi tra parentesi graffe sono segnaposto)

IMMAGINE MODIFICATA

<div id="divMenuItemMedia">
<img id="imgMenuItemMedia" alt="someAlt" src="/images//{Controller}/{Action}/{InitialImageId}" />
</div>

PULSANTE PER APRIRE POPUP

<input type="button" id="btnModifyImage" name="btnModifyImage" class="t-button" value="Change Image" onclick="showImageChooser();" />

FUNZIONI JAVASCRIPT

PAGINA PRINCIPALE

function GetCurrentMediaItemsByIds(pId, iId) {
//$("#imgMenuItemMedia").load(function () {
//alert("Image updated");
// });
var imgMedia = document.getElementById("imgMenuItemMedia");
var sourceUrl = "/{Controller}/{Action}/{pId}/{iId}";
//$("#imgMenuItemMedia").attr("src", sourceUrl);
imgMedia.src = sourceUrl;
InImageSelectionMode = false;
}

function showImageChooser() {
var url = "{Controller}/{DataGetterActionForPopup}";
ShowPopup(url, "#MediaChooserDialog", null);
}

APPARIRE

function associateMediaSelection(e) {
// The entity name is saved in hidden field in the "Edit" page
var entityName = document.getElementById("hidEntityName").value;
var contentPath = entityName + "/Associate" + entityName + "ToMediaItem";
var url = "{Controller}/{Action}";
var primaryId = {pId};
var secondaryId = {sId};
var entityId = {eId};
var data = { "entityId" : eId, "primaryId": pId, "secondaryId": sId };

var jqxhr = $.post(url, data, function (e) {
GetCurrentMediaItemsByIds(presentationId, document.getElementById("hid" + entityName + "Id").value);

closeMediaSelection();
});
}
function closeMediaSelection()
{
var windowPopup = $("#MediaChooserDialog").data("tWindow");
windowPopup.close();
}

Qualcuno ha un'idea di cosa potrebbe impedire l'aggiornamento dell'immagine?

risposte:

1 per risposta № 1

Immagino che questo sia il codice completo e reale. In quel caso:

var sourceUrl = "/ {Controller} / {Action} / {pId} / {iId}";

sarà un problema, in quanto ciò non significa nulla in JavaScript. Puoi inserire:

var sourceUrl = "@ Url.Action (" Action "," Controller ")"

dove Action e Controller sono compilati con i nomi del controller / metodo di azione.

---