none
Jquery Ajax Arquivo externo. RRS feed

  • Pergunta

  • Galera o metodo ajax tem que estar na propria pagina? nao posso criar um arquivo externo e vincular?

    quando eu faco isso nao funciona.

    obrigado.

    sábado, 24 de janeiro de 2015 14:58

Todas as Respostas

  • Rodrigo,

    O método ajax pode estar em um arquivo externo. Contudo, é importante que vc referencia a biblioteca jquery antes de apontar para este arquivo numa página.

    Espero ter ajudado.

    Abs

    sábado, 24 de janeiro de 2015 15:16
  • Estou fazendo isso veja esta o  codigo.

    .aspx

    <head id="Head1" runat="server">
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title></title>
        <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css?parameter=1" rel="stylesheet">
        <link href="Content/css/StyleSitePrincipal.css" rel="stylesheet" type="text/css" />
        <script src="http://code.jquery.com/jquery-2.1.0.min.js?parameter=1""></script>
        <script src="Scripts/AjaxMethods.js" type="text/javascript"></script>
    </head>
    .js
    /*Popula DDLS Programa*/
    
    $(document).ready(function () {
        $.ajax({
            type: "POST",
            url: "Default.aspx/listDDLCanal",
            data: "",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                $("#<%= ddlPrograma.ClientID %>").empty().append($("<option></option>").val("0").html("Selecione"));
                for (var i = 0; i < data.d.length; i++) {
                    $("#<%= ddlPrograma.ClientID %>").append($("<option value=" + data.d[i].IdCanal + ">" + data.d[i].NmCanal + "</option>"));
                }
            },
            error: function () {
                alert("An error has occurred during processing your request.");
            }
        });
    });
    

     <form id="Form1" class="form-horizontal" runat="server">
                               
                        <!-- Text input-->
                                <div class="form-group">
                                  <label class="col-md-4 col-sm-4 control-label" for="textinput">Usúario:</label>  
                                  <div class="col-md-7 col-sm-7">
                                  <input id="textinput" name="textinput" type="text" placeholder="Digite o Usúario" class="form-control input-md form-control input-xs">
                                   
                                  </div>
                                </div>
    
                                <!-- Text input-->
                                <div class="form-group">
                                  <label class="col-md-4 col-sm-4 control-label" for="textinput">Senha:</label>  
                                  <div class="col-md-7 col-sm-7">
                                  <input id="textinput" name="textinput" type="password" placeholder="Digite a Senha" class="form-control input-md">
                                   
                                  </div>
                                </div>
    
                                <!-- Select Basic -->
                                <div class="form-group">
                                  <label class="col-md-4 col-sm-4 control-label" for="selectbasic">Programa:</label>
                                  <div class="col-md-7 col-sm-7">
                                    <asp:DropDownList runat="server" id="ddlPrograma" name="selectbasic" 
                                          class="form-control">
                                    </asp:DropDownList>
                                  </div>
                                </div>
    
                                <!-- Select Basic -->
                                <div class="form-group">
                                  <label class="col-md-4 col-sm-4 control-label" for="selectbasic">Canal:</label>
                                  <div class="col-md-7 col-sm-7">
                                    <asp:DropDownList runat="server" id="ddlCanal" name="selectbasic" class="form-control" AutoPostBack="true" ClientIDMode="Static">
                                     </asp:DropDownList>
                                  </div>
                                </div>
    
                                <!-- Button (Double) -->
                                <div class="form-group">
                                  
                                  <div class="col-md-12 text-center">
                                    <asp:Button ID="btnEntrar" runat="server" class="btn btn-success" Text="Entrar" />
                                    <asp:Button ID="btnLimpar" runat="server" class="btn btn-danger"  Text="Limpar"/>
                               
                                </div>
    
                                </div>
                                </form>

    obrigado pela ajuda amigo.

    sábado, 24 de janeiro de 2015 15:58
  • Rodrigo,

    Como vc declarou o método listDDLCanal no arquivo Default.aspx.cs? Ele está como estático e marcado com o parâmetro WebMethod?

    sábado, 24 de janeiro de 2015 17:04
  • Sim Renato veja se é uma boa pratica  abaixo:

    Default.aspx.cs

            [WebMethod]
            public static List<Canal> listDDLCanal()
            {
                
                var canalBLL = new CanalBLL();
    
                return canalBLL.reader();
            }

    BLL

      public List<Canal> reader()
            {
                var objCanal =  new Canal();
    
                return new List<Canal> {
    
                new Canal{IDCanal=1,NmCanal="PEX"}
                ,new Canal{IDCanal=13,NmCanal="CANAL 13"}
                ,new Canal{IDCanal=15,NmCanal="CANAL 15"}
                ,new Canal{IDCanal=17,NmCanal="CONTROLE ESTOQUE" }
                };
            }


    Se eu coloco o arquivo js no header na propria pagina funciona.


    ex

     <script>
            $(document).ready(function () {
                $.ajax({
                    type: "POST",
                    url: "Default.aspx/listDDLCanal",
                    data: "{}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        $("#<%= ddlPrograma.ClientID %>").empty().append($("<option></option>").val("0").html("Selecione"));
                        for (var i = 0; i < data.d.length; i++) {
                            $("#<%= ddlPrograma.ClientID %>").append($("<option value=" + data.d[i].IdCanal + ">" + data.d[i].NmCanal + "</option>"));
                        }
                    },
                    error: function () {
                        alert("An error has occurred during processing your request.");
                    }
                });
            });
        </script>

    sábado, 24 de janeiro de 2015 20:08
  • Até aí normal Rodrigo, pensei que fosse algum problema  com o método que vc retorna as informações.
    sábado, 24 de janeiro de 2015 20:10
  • Só nao funciona quando eu referencio esse metodo em um arquivo .js externo.

    simplesmente nao faz nada, nem erro no firebug detecta.

     <script src="http://code.jquery.com/jquery-2.1.0.min.js?parameter=1""></script>
        <script src="Scripts/AjaxMethods.js" type="text/javascript"></script>

    sábado, 24 de janeiro de 2015 20:33
  • A pasta Scripts fica logo abaixo da raiz na sua aplicação?

    Tente essa declaração:

    <script src="~/Scripts/AjaxMethods.js" type="text/javascript"></script>

    Se nem assim for, outra solução é utilizar o método ResolveUrl (que resolve problemas parecidos com esse ao se utilizar aplicações Web em um diretório virtual). Ficaria da seguinte forma:

    <script src='<%= ResolveUrl("~/Scripts/AjaxMethods.js") %>' type="text/javascript"></script>

    Sobre essa segunda maneira, eu escrevi uma artigo tempos atrás a respeito e acredito que possa ser útil a vc:

    http://www.devmedia.com.br/alguns-cuidados-uteis-na-implantacao-de-aplicacoes-asp-net/27873

    • Sugerido como Resposta Renato GroffeMVP sexta-feira, 20 de fevereiro de 2015 21:46
    sábado, 24 de janeiro de 2015 21:24
  • Obrigado Renato era isso mesmo.
    domingo, 25 de janeiro de 2015 17:38
  • Blz Rodrigo, fico contente que tenha dado certo!
    domingo, 25 de janeiro de 2015 17:47
  • Opa, E aew Rodrigo blz?

    Man, acredito que o js externo tenha dois problemas

    1 - A url do ajax, pois como está na pasta script, não existe nenhum arquivo Default.aspx dentro de scripts, logo você tem que voltar um nivel.

    2 - Quando você colocar o js dentro de um arquivo externo a propriedade as asp "<%=  %>" não funciona, o legal seria vc criar as variáveis na pagina e passar para o arquivo ou definir o ClientIDMode como Static e no próprio js você passa o nome dele, no caso "#ddlPrograma".

    Aparentemente só tem isso de errado!

    Qualquer coisa só chamar ;)

    Att.

    Rodolfo Oliveira

    sexta-feira, 20 de fevereiro de 2015 18:01