@model CMS.ViewModel.Imagens.IndexViewModel

<style type="text/css">
.TitImage{display:none;}
</style>

<script src="@Url.Content("/Scripts/jquery-1.7.2.js")" type="text/javascript"></script>


<div class="ListaImagens" id="LisImg">
    <ul class="Imagens" id="Imgs">
        @foreach (var image in Model.ListaImagem)
        {

            <li class="ListaImagem"><a class="Imagem">
                <img src="/upload/imagens/150x74/@image.Src" alt="@image.Titulo"/>
            </a><span class="TituloImagem">@image.Titulo </span><input type="text" value="@image.Titulo" class="TitImage" id="TextImage"/>
            <input type="hidden" value="@image.Id" id="TituloImagemVal" />
                <label class="Botoes">
                    @Html.ActionLink("Editar", "Editar", new { id = image.Id }) |
                    @Html.ActionLink("Deletar", "Deletar", new { id = image.Id })
                </label>
            </li>

        }
    </ul>
</div>

<script type="text/javascript">

    $(function () {

        $('.ListaImagem .TituloImagem').live('click', function (event) {

            event.preventDefault();
            event.stopPropagation();

            var TituloImagem = $(this);

            TituloImagem.hide(); //Oculta o span com o Título
            TituloImagem.next().focus(); //Seta o Focus no Textbox
            TituloImagem.next().show(); //Exibe o input com o título

            var TxtImagem = $("#TextImage").attr("value");
            console.log(TxtImagem);

            $('#TextImage').keypress(function (event) {


                if (event.which == 13) {

                    event.stopPropagation();
                    //Realiza a alteração do TITULO
                    TrocaNomedaImagem();

                }


            });


        });

    });



    function TrocaNomedaImagem() {

        //Passo o valor do textbox para esta variavel
        var TituloImagem = $('#TextImage').val();

        //Passa o valor do id para a variavel ImagemId
        var ImagemId = $('#TituloImagemVal').val();

        $.ajax({
            type: "POST",
            url: "/Imagens/Editar?id=" + ImagemId + "&Titulo=" + TituloImagem,

            error: function () {
                alert('Não foi possivél realizar a operação, entre em contato com o suporte.')
            },

            success: function (data) {

            }

        });


        $('.TitImage').hide();
        $('.TituloImagem').show();
       // TituloImagem.next().unbind();

    }



</script>