Foros del Web » Programando para Internet » Ruby »

[SOLUCIONADO] Problema con función javascript

Estas en el tema de Problema con función javascript en el foro de Ruby en Foros del Web. Hola a todos, un saludo. Tengo un inconveniente con un proyecto rails, mas exactamente con una función javascript . Estoy tratando de terminar unos selects ...
  #1 (permalink)  
Antiguo 17/01/2014, 09:43
Avatar de calichecal  
Fecha de Ingreso: junio-2009
Ubicación: Colombia
Mensajes: 288
Antigüedad: 12 años, 3 meses
Puntos: 12
Problema con función javascript

Hola a todos, un saludo.

Tengo un inconveniente con un proyecto rails, mas exactamente con una función javascript. Estoy tratando de terminar unos selects dinamicos que ayuden a seleccionar un municipio.

Osea, que se carguen unos municipios en un select en base al departamento seleccionado en otro select:

con este script:

dynamic_municipios.js.erb

Cita:
var municipios = new Array();
<% for municipio in @municipios -%>
municipios.push(new Array(<%= municipio.departamentos_id %>, '<%=h municipio.nombre %>', <%= municipio.id %>));
<% end -%>

function departamentoSelected() {
departamentos_id = $('municipios_departamentos_id').getValue();
options = $('negocios_municipios_id').options;

options.length = 1;
municipios.each(function(municipio) {
if (municipio[0] == departamentos_id) {
options[options.length] = new Option(municipio[1], municipio[2]);
}
});
if (options.length == 1) {
$('state_field').hide();
} else {
$('state_field').show();
}
}

document.observe('dom:loaded', function() {
departamentoSelected();
$('municipios_departamentos_id').observe('change', departamentoSelected);
});

Todo iba bien, estoy siguiendo este tutorial:
http://railscasts.com/episodes/88-dynamic-select-menus


Pero al final cuando lo fui a probar, firebug me arrojo este error:
Cita:
TypeError: document.observe is not a function
[Parar en este error]

document.observe('dom:loaded', function() {
He encontrado una supuesta solución de reemplazar jquery por prototype, pero no puedo hacer eso, estoy utilizando bootstrat.

Agradezco sus aportes y consejos, este es mi gemfile:

Código HTML:
source 'https://rubygems.org'

gem 'rails', '3.2.13'
gem 'strong_parameters'
gem 'mysql2'
gem 'execjs','2.0.2'
gem 'rake' , '10.1.1'
gem 'therubyracer'
gem "less-rails"


# gem 'will_paginate', '3.0.3'
group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'
  gem 'uglifier', '>= 1.0.3'

  # ejecutar rails g bootstrap:install, despues del bundle install

end

  gem 'twitter-bootstrap-rails'
  gem 'jquery-rails'
  gem "paperclip", :git => "http://github.com/thoughtbot/paperclip.git"
Y esto es lo que tengo en mi aplication.js

Cita:
//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require_tree .
__________________
Hay una fuerza motriz más poderosa que el vapor, la electricidad y la energía atómica: la voluntad. -Einstein-
  #2 (permalink)  
Antiguo 17/01/2014, 10:48
Avatar de abimex
Colaborador
 
Fecha de Ingreso: marzo-2007
Ubicación: ~
Mensajes: 751
Antigüedad: 14 años, 6 meses
Puntos: 137
Respuesta: Problema con función javascript

pues sustituye las funciones que utilizes por cosas de jQUery, por ejemplo

"document.observe('dom:loaded', function() {" por "$(document).on('ready', function(){"
"$('municipios_departamentos_id').observe" por "$('municipios_departamentos_id').on"

Y asi creo que hay otras cosas, pero no lo voy a hacer todo por ti ;P

Un saludo!
__________________
>> abimaelmartell.com
  #3 (permalink)  
Antiguo 17/01/2014, 11:01
Avatar de calichecal  
Fecha de Ingreso: junio-2009
Ubicación: Colombia
Mensajes: 288
Antigüedad: 12 años, 3 meses
Puntos: 12
Respuesta: Problema con función javascript

Cita:
Iniciado por abimex Ver Mensaje
pues sustituye las funciones que utilizes por cosas de jQUery, por ejemplo

"document.observe('dom:loaded', function() {" por "$(document).on('ready', function(){"
"$('municipios_departamentos_id').observe" por "$('municipios_departamentos_id').on"

Y asi creo que hay otras cosas, pero no lo voy a hacer todo por ti ;P

Un saludo!
Hola !! muchas gracias abimex ya había hecho algo similar,

Código PHP:
$(document).ready( function() {
    $(
"#municipios_departamentos_id").change( function() {
          
departamentoSelected();
    });
}); 

pero no me estaba funcionando, jeje en realidad estoy mas orientado al back-end, pero con lo tuyo creo que ya funcionará..
__________________
Hay una fuerza motriz más poderosa que el vapor, la electricidad y la energía atómica: la voluntad. -Einstein-
  #4 (permalink)  
Antiguo 17/01/2014, 22:38
Avatar de calichecal  
Fecha de Ingreso: junio-2009
Ubicación: Colombia
Mensajes: 288
Antigüedad: 12 años, 3 meses
Puntos: 12
Respuesta: Problema con función javascript

Lo logre !! para cualquiera quien sigua este tutorial:

http://railscasts.com/episodes/88-dynamic-select-menus

pero este trabajando con bootstrap, entonces el script que esta en prototype, puede quedar en jquery de la siguiente manera:

Código PHP:
var municipios = new Array();
<% for 
municipio in @municipios -%>
  
municipios.push(new Array(<%= municipio.departamentos_id %>, '<%=h municipio.nombre %>', <%= municipio.id %>));
<% 
end -%>

function 
departamentoSelected() {

 
  
departamentos_id = $('#municipios_departamentos_id').val();
 

 
     
    $(
'#negocios_municipios_id').html('');
    $(
'#negocios_municipios_id').append('<option value="">Seleccione un municipio</option>');

    for (
i=0;i<municipios.length;i++){ 
        if (
municipios[i][0] == departamentos_id){

          $(
'#negocios_municipios_id').append('<option value="'+municipios[i][2]+'" >'+municipios[i][1]+'</option>');
        }
    } 


    if ($(
'#negocios_municipios_id option').length == 1) {
      $(
'#state_field').hide();
    } else {
      $(
'#state_field').show();
    }
  

}


$(
document).ready(function(){
  
departamentoSelected();
  $(
'#municipios_departamentos_id').on('change'departamentoSelected);
}); 
__________________
Hay una fuerza motriz más poderosa que el vapor, la electricidad y la energía atómica: la voluntad. -Einstein-

Etiquetas: bootstrap, javascript-funciones, prototype, rails
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 18:08.