Cambiar imagen src a través de MVC 3 Acción - jquery, imagen, asp.net-mvc-3, src

Tengo una página con una etiqueta de imagen. La imagen mostrada por la etiqueta de imagen cambia según la selección de imagen realizada en una ventana emergente. Los siguientes son los pasos para reproducir mis problemas:

 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

Para todos los fines prácticos, el código está funcionando.excepto por el molesto problema que, independientemente del navegador, la imagen no se actualiza al regresar del Controlador a través del proceso descrito anteriormente (durante la función "Success" de JQuery.post).

Una cosa a tener en cuenta, es que si los pasos "b.i" - "b.iv "se ejecutan sin" JQuery.post "(es decir, solo se recuperan los datos de la imagen sin hacer una asociación primero) la imagen se actualiza cada vez. El código utilizado está debajo (redactado: los elementos entre corchetes son marcadores de posición)

Imagen modificada

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

BOTÓN PARA TRAER POPUP

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

FUNCIONES DE JAVASCRIPT

PAGINA PRINCIPAL

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);
}

SURGIR

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();
}

¿Alguien tiene una idea de lo que puede estar impidiendo la actualización de la imagen?

Respuestas

1 para la respuesta № 1

Supongo que aquí este es el código completo y real. En ese caso:

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

Será un problema, ya que esto no significa nada en javaascript. Yon puede insertar:

var sourceUrl = "@ Url.Action (" Acción "," Controlador ")"

donde Acción y Controlador se completan con los nombres de su controlador / método de acción.

---