Question

How to add a title for the JqueryUI dialog box for this case. This dialog box opens as per the model name in ruby on rails.

Example of the html page:

<%= link_to pro_generic_lookup_data_path("Enr::Rds::Section2009", format: :js), data: {remote: true} %>

Here, the pro_generic_lookup_data is have the option of uidialog box. So, it would open depend upon the model name("Enr::Rds::Section2009").

JavaScript

var generic_lookup_Enr_Rds_Section2009_selected = function(id, to_s) {
  var section_value = $(".cross-reference-section-value");
  var section_id = $(".cross-reference-section-value-id");
  var section_clear_img = $(".cross-reference-section-clear-img");
  section_id.val(id);
  section_value.text(to_s);
  section_value.css('display', 'inline');
  section_clear_img.css('display', 'inline');
  $(section_clear_img).on('click', function() {
    section_value.text('')
    section_id.val('')
    section_clear_img.css('display', 'none');
  });
  var question_link = $('#question_picker').attr('href');
  question_link = question_link.replace(/\?+$/, '');
  question_link = question_link + '?columns[enr_rds_section_id]=' + id;
  $('#question_picker').attr('href', question_link);
  $("#modal_popup").dialog("destroy");      
};

I have three fields like this same. So, I need to give a separate titles for all the three fields. Thanks!

Answer 1

Other than some basic formatting and using chained selectors where applicable, the code is fine.

var generic_lookup_Enr_Rds_Section2009_selected = function(id, to_s) {
    var $section_value = $(".cross-reference-section-value");
    var $section_id = $(".cross-reference-section-value-id");
    var $section_clear_img = $(".cross-reference-section-clear-img");

    $section_id.val(id);    
    $section_value.text(to_s).css('display', 'inline');

    $section_clear_img.css('display', 'inline').on('click', function() {
        $section_value.text('')
        $section_id.val('')
        $section_clear_img.css('display', 'none');
    });

    var question_link = $('#question_picker').attr('href');
    question_link = question_link.replace(/\?+$/, '');
    question_link = question_link + '?columns[enr_rds_section_id]=' + id;
    $('#question_picker').prop('href', question_link);

    $("#modal_popup").dialog("destroy");      
};