cyklop77

да в том то и дело, что всё то же самое и у меня(

помогите пожалуйста решить проблему

в примерах бутстрапа на этой страничке вы верхнем меню есть выпадающий пункт 'Dropdown'

я взял эту страничку и вставил в верхнее меню html выпадающего пункта. в результате в меню появился пункт "Голосования", но после клика не происходит выпадание пунктов. вот пример моей странички

на моей страничке после клика по пункту "Голосования" firebug показывает мигание класса dropdown, а должно происходить преобразованиие класса в dropdown open

помогите пожалуйста советом, а лучше примерами

написал ajax-обработчики всего для трёх действий(CUD) и ужаснулся. хоть старался и не говнокодить, но жуткая простыня кода получилась. и подобного кода придётся написать в 5-10 раз больше

$( document ).ready(function() {    // album ajax events    $(document).on('click', '.destroy_album', handlerDestroyAlbum);    $(document).on('click', '.edit_album', handlerEditAlbumFormOutput);    // editalbum form output through ajax    function handlerEditAlbumFormOutput(){      var link = $(this),          article = link.closest('article'),          currentUserNameId = article.attr('data-current-user'),          albumId = article.attr('data-album-id');      $.ajax({        url: '/users/' + currentUserNameId + '/get_album_data/' + albumId,        type: 'GET',        data: $('form').serialize(),        success: function(album){          $('#album_title_update').val(album.title);          $('#album_description_updte').val(album.description);          $('#modalUpdateAlbum').modal();        },        error: function(xhr, ajaxOptions, thrownError){          handleModal('Невозможно редактировать альбом', 'Ошибка на сервере. Повторите попытку через некоторое время. ', 'f00', 2000);        }              })      $(document).on('click', '#updateAlbumSubmit', handlerEditAlbumUpdate);      // editalbum form send data to update-action       function handlerEditAlbumUpdate(e){        e.preventDefault();        $.ajax({          url: '/users/' + currentUserNameId + '/albums/' + albumId,          type: 'PATCH',          data: $('form').serialize(),          success: function(album){            article.find('.title').html(album.title);            article.find('.body').html(album.description);            $('#modalUpdateAlbum').modal('hide');          },          error: function(xhr, ajaxOptions, thrownError){            errorText = handleConstructErrorMessage(xhr.responseText);            handleModal('Альбом не создан', errorText, 'f00', 10000);          }                })      }            }       // destroy album ajax handler    function handlerDestroyAlbum(e){      e.preventDefault();      var link = $(this),          article = link.closest('article'),          currentUserNameId = article.attr('data-current-user'),          albumId = article.attr('data-album-id');      $.ajax({        url: '/users/' + currentUserNameId + '/albums/' + albumId,        type: 'POST',        data: { _method: 'DELETE' },        success: function(result){          article.fadeOut(300);          handleModal('Удаление альбома прошло успешно', '', '00ff2a', 2000);        },        error: function(xhr, ajaxOptions, thrownError){          handleModal('Удаление альбома завершилось с ошибкой', 'У вас не хватает прав. ' + xhr.status + ' error', 'f00', 2000);        }              })    }    // create album ajax    $('#new_album').on('submit', function(e){      e.preventDefault();      var currentUserId = $(this).attr('data-current-user'),          albumTitle = $('input#album_title'),          albumDescription = $('textarea#album_description');      $.ajax({        url: '/users/' + currentUserId + '/albums',        type: 'POST',        dataType: "JSON",         data: $('#new_album').serialize(),        success: function(album){          handleModal('Альбом создан', '', '00ff2a', 2000);          albumTitle.val('');          albumDescription.val('');          $('#albumsList').prepend(handleConstructAlbumTeaser(currentUserId, album));        },        error: function(xhr, ajaxOptions, thrownError){          errorText = handleConstructErrorMessage(xhr.responseText);          handleModal('Альбом не создан', errorText, 'f00', 10000);        }              })    });      // handle construct album teaser to html-format    function handleConstructAlbumTeaser(currentUserId, album){      var albumTeaser;      albumTeaser = '<article class="col-xs-12 col-sm-6 col-md-4" data-current-user="' + currentUserId + '" data-album-id="' + album.id + '"> \            <h3 class="title">' + album.title + '</h3> \            <p class="body">' + album.description + '</p> \            <p class="details"> \              <a class="btn btn-default" href="/users/' + currentUserId + '/albums/' + album.id + '">Подробнее...</a> \              <span class="glyphicon glyphicon-remove pull-right destroy_album"></span> \              <span class="glyphicon glyphicon-edit pull-right edit_album"></span> \            </p> \          </article>';      return albumTeaser;    }    // construct error messages to html-format    function handleConstructErrorMessage(errorsArray){      var errorText = '';      $.each(JSON.parse(errorsArray), function(key, val){        errorText += (key+1) + '.' + val + '<br /><br />'      })      return errorText;    }    // handle modal window. for all ajax-requests    function handleModal(title, body, colorHex, timeout){      $('#titleModalInfo').html(title).css({'color': '#' + colorHex});      $('#bodyModalInfo').html(body);      $('#modalInfo').modal();      setTimeout(deinitializationModalInfo, timeout)      function deinitializationModalInfo(){        $('#modalInfo').modal('hide');        $('#titleModalInfo').empty();        $('#bodyModalInfo').empty();      };    }}); 

подскажите пожалуйста как правильные пацаны организуют js-код в модули или в другие удобные структуры. существуют какие-нибудь примеры хорошего стиля?

или пожалуйста поскажите что можно хорошего с этим кодом сделать. первая мысль у меня была разбрасывать по отдельным файлам, а потом на страничке подключать это хозяйство, но это увеличивает количество запросов к серверу

только не советуйте использовать ангуляры и прочие подобные штуки

$(document).on({    click : function() {        $('#modalEditAlbum').modal();    }}, '.edit_album');

спасибо, но мне тут важнее причину понять

помогите пожалуйста разобраться и исправить код

после клика на элементе .edit_album я вызываю бутстраповское модальное окно так:

$(document).on('click', '.edit_album', eee);function eee(){  $('#modalEditAlbum').modal();}

этот способ работает. но следующий способ не работает:

$(document).on('click', '.edit_album', $('#modalEditAlbum').modal());

так как в результате модальное окно вызывается при загрузке странички, а этого мне не надо

del 

помогите пожалуйста разобраться

есть форма, которая отправляет в контроллер такой ajax-запрос:

$.ajax({  ..................  success: function(data){    alert('ok');  },  error: function(xhr, ajaxOptions, thrownError){    alert('no ok' + xhr.status);  }        })

контроллер возвращает статус 200 или 4хх и на основе этого срабатывает или success или error. но я хотел бы чтобы контроллер возвращал не просто статус запроса, а массив с ошибками валидации. на стороне контроллера не проблема сделать отправку этого массива. проблема в том как получить его в ajax-блоке

было бы хорошо получить его как один из параметров процедуры error. возможно ли такое, подскажите пожалуйста?

если нет, то придётся заставить контроллер в любом случае возвращать статус 200 вместе с массивом ошибок и уже в процедуре success добавлять сложную логику. приемлем ли такой метод, хорошая ли это практика?

вот схематично экшен контроллера, которые принимает запрос из формы:

def create  .......  if @album.save    render json: @album, :status => 200   else    render json: @errors, :status => 403   endend    

$('.exist_parent_on_generation_DOM').on('click', '.el', function(e){   //bla}

это понятно. но дело в том, что вместо этого bla у меня довольно много кода. и при таком подходе мне придётся этот код дублировать. вот моя функция полностью:

    // create album ajax    $('#new_album').on('submit', function(e){      e.preventDefault();      var currentUserId = $(this).attr('data-current-user'),          albumTitle = $('input#album_title').val();      $.ajax({        url: '/users/' + currentUserId + '/albums',        type: 'POST',        dataType: "JSON",         data: $('#new_album').serialize(),        success: function(result){          console.log(result);          handleModal('album create', 'is successfull', '00ff2a', 2000);          $('input#album_title').val('');          $('#albumsList tbody').append('<tr> \            <td>' + albumTitle + '</td> \            <td></td> \            <td></td> \            <td><span class="destroy_album" data-album-id="' + result.id + '">destroy</span></td> \          </tr>');        },        error: function(xhr, ajaxOptions, thrownError){          handleModal('album create', 'is failed. ' + xhr.status + ' error.', 'f00', 2000);        }              })    });      // handle modal window    function handleModal(title, body, colorHex, timeout){      $('#titleModalInfo').html(title).css({'color': '#' + colorHex});      $('#bodyModalInfo').html(body);      $('#modalInfo').modal();      setTimeout(deinitializationModalInfo, timeout)      function deinitializationModalInfo(){        $('#modalInfo').modal('hide');        $('#titleModalInfo').empty();        $('#bodyModalInfo').empty();      };    }

в общем, проблема наверное в том как код раскидать, а не обработчик повесть. поторопился я тему создавать

помогите пожалуйста советом

на страничке есть список из 10 элементов. на каждый элемент повешен обработчик:

$('#el').on('click', function(e){   bla}

обаботчик вешает некоторый цикл, который отрабатывает по событию document.ready

затем я при помощи ajax добавляю несколько элементов к вышеуказанному списку. проблема в том, что с ними не связан вушеуказанный  обработчик. поэтому мне приходится обновлять страницу, в результате чего цикл вновь переберёт все элементы списка и повесит на каждый элемент обработчик

подскажите пожалуйста как мне повесить обработчик на вновьдобавленные элементы, не обновляя страничку

помогите пожалуйста отловить событие

 html:

<div class="notice_area"></div>

по ходу программы в этот блок будут при помощи ajax-запроса вставляться сообщения с разметкой. таким образом:

$('.notice_area').html('<div class="alert  alert-success">album is added successfull.</div>'); 

хотелось бы отловить событие вставки сообщения в .notice_area

болванка:

...а у кого-нибудь были проблемы с воспроизведением mp4 в opera? вроде бы opera с довольно древней верии уже поддерживает тег video, но у меня кроме панели ничего не отображается и не проигрывается. в консоли чисто

при этом видео с демо-сайтов, встроенные через тег video нормально в моей опере проигрываются

помогите пожалуйста советом

непонятно как можно стилизовать панель html5-тега video. понятно, что там все элементы представляют себя псевдоэлементы. и даже, поискав в интернетах, можно названия этих псевдоэлементов получить. но ни ff, ни chrome не показывают ни одного псевдоэлемента. а хотелось бы увидеть

http://jsfiddle.net/eLqL73nm/

 

Нажмите на кнопку, а потом поменяйте местами навешивание событий на button и нажмите на кнопку еще раз. Если бы оба действия выполнялись в одном обработчике такого бы не произошло.

кажется понял зачем. то есть во время существования проекта любой программист из команды может по неосторожности поменять расположение метода и тем самым нарушить задуманную функциональность. так?

помогите пожалуйста разобраться в вопросе

 
в книжке "совершенный код" вычитал совет о том, что нужно по возможности скрывать очерёдность действий в методе

[hide]Сокрытие очередности действий. Скрывать очередность обработки событий — разумная идея. Например, если программа обычно сначала вызывает метод, запрашивающий информацию у пользователя, а после этого — метод, читающий вспомогательные данные из файла, никакой из этих двух методов не должен зависеть от порядка их выполнения. В качестве другого примера можно привести две строки кода, первая из которых читает верхний элемент стека, а вторая уменьшает переменную stackTop. Вместо того чтобы распространять такой код по всей системе, скройте предположение о необходимом порядке выполнения двух операций, поместив две эти строки в метод PopStack().[/hide]

не могу понять в чём польза такого подхода. объясните пожалуйста

я понимаю, что здесь что-то связанное с снижением сложности. но снижение сложности там идёт отдельным пунктом. это и смущает

на вашем месте я заказал бы новый(нормальный уже) сайт. возни будет меньше

сорри, ребят. я лошара. действительно работает. проблема была в том, что в ruby-фреймворке, который я использовал, был включен модуль turbolinks, а он обновлял только то, что содержится в body (но не в head). в свою очередь мой js был подключен как раз в head

ну тыкни на картинку правой кнопкой мыши. сравни пути. мало ты информации предоставил, как тебе конкретнее ответить?

в настройках пути поменяй. в файлах конфига тоже кажется. я точно не помню порядок действий, но в бложиках полно статей на эту тему

хорошая, крупная, стабильная компания зарплаты для каждой позиции официально не определила или ты как посредник просто забыл указать?

спасибо. но всё равно природа явления не понятна мне. вот сами попробуйте запустить фиддл, а потом в адресной строке поменять ru на en, и снова запустить

function getParameterByName(name) {    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");    var regex = new RegExp("[\\?&]" + name + "=([^]*)"),        results = regex.exec(location.search);    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));}

Нашёл где-то когда-то

 

что-то не работает. jsfiddle

помогите пожалуйста советом

на сайте каждый url содержит 

?locale=ru

 или 

?locale=en

на странице есть переключатель, который меняет параметр locale на противоположный и перегружает страницу. я про помощи следующего скрипта пытаюсь на основе get-параметра присваивать класс active определённому элементу:

$(document).ready(function() {   var get = window.location.search,      langContainer = $('.language_area'),      rusToggler = $('#rus'),      engToggler = $('#eng');  console.log(get);  langContainer.find('a').removeClass('active');  if(get.indexOf('locale=ru')){    console.log(11);    rusToggler.addClass('active');   }else{    console.log(22);    engToggler.addClass('active');   }});

проблема в том, что в адресной строке get-параметр меняется, а в скрипте - нет. то есть консоль всегда выводит:

?locale=en

в чём может быть проблема?

я что-то совсем с первого взгляда не врубился в надписи типа "Сложность: средняя". но это очень субъективно

в общем получилось всё таки получилось вашим способом решить задачу. вот это помогло

так если все картинки должны отображаться с одинаковым размером, то задайте сами высоту.

ну высота картинок же меняется при изменении ширины экрана...