livesearch field id has changed

SteveX
@ultrajam
4 years ago
2,583 posts

Hi Jamroom Team! I hope you are all safe and well.

I am looking at some custom modules which use live search fields, they are no longer working properly.

A live_search field no longer uses the field name in the id, it's an md5 hash of the form token instead.

I have javascript listeners which use that id to listen for changes to the livesearch_value hidden field. The js is added to the form page javascript_ready_function.

In the form view function, how do I get the field's id or the form token to use in the js?

Thanks

--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
updated by @ultrajam: 09/15/20 12:48:35AM

@michael
4 years ago
7,692 posts

A structure for live search looks like this:

  $_tmp = array(
        'name'          => 'profile_user_id',
        'group'         => 'admin',
        'label'         => 'profile owner',
        'help'          => 'What User Account should this profile be created for?  The User Account selected here will have admin capabilities for the Profile.',
        'type'          => 'live_search',
        'target'        => "{$_conf['jrCore_base_url']}/{$_post['module_url']}/get_profile_users",
        'required'      => false,
        'validate'      => 'number_nz',
        'form_designer' => false // We do not allow the form designer to override this field
    );
    jrCore_form_field_create($_tmp);

the 'get_profile_users' function looks like this:


//------------------------------
// get_profile_users
//------------------------------
function view_jrProfile_get_profile_users($_post, $_user, $_conf)
{
    jrUser_admin_only();
    $lim = 12;
    if (!empty($_post['limit']) && jrCore_checktype($_post['limit'], 'number_nz')) {
        $lim = (int) $_post['limit'];
    }
    $_sc = array(
        'search'         => array(
            "user_name like {$_post['q']}%"
        ),
        'return_keys'    => array('_user_id', 'user_name'),
        'skip_triggers'  => true,
        'ignore_pending' => true,
        'privacy_check'  => false,
        'limit'          => $lim
    );
    $_rt = jrCore_db_search_items('jrUser', $_sc);
    $_sl = array();
    if ($_rt && is_array($_rt) && is_array($_rt['_items'])) {
        foreach ($_rt['_items'] as $_v) {
            $_sl["{$_v['_user_id']}"] = $_v['user_name'];
        }
    }
    return jrCore_live_search_results('profile_user_id', $_sl);
}

If you only have one live_search on the page, it will have the class .live_search_text. You're wanting to get the ID for that right? If so, then you could do:

var id = $('.live_search_text').attr('id');

If you've got more than one, then we probably should add a unique class name into the core code, so there is a .live_search_unique_(field_name) in there too. You need that?
updated by @michael: 06/14/20 07:00:12PM

@michael
4 years ago
7,692 posts

from jrCore 6.5.4 the field name will be there as a class too, so if your field is 'something_something' then it will have a class 'live_search_something_something' which you can use to target to get the ID or just target off of that as it will be unique.

SteveX
@ultrajam
4 years ago
2,583 posts

Hi Michael, the field used to have the id mymod_profile and the hidden field used to be mymod_profile_livesearch_value, but now the field is ls8098794ccd5cc6954208a17efdfed1c0, an md5 of the form token.

It's the hidden field change which is listened for, it changes after the user has made their selection.

This is what I see in the form html:

<input type="text" id="ls8098794ccd5cc6954208a17efdfed1c0" class="form_text" name="ls8098794ccd5cc6954208a17efdfed1c0" value="SteveX" tabindex="2" onfocus="if($(this).val() == 'search'){ $(this).val('').removeClass('live_search_text'); }" autocomplete="off">

<input type="hidden" id="ls8098794ccd5cc6954208a17efdfed1c0_livesearch_value" name="ls8098794ccd5cc6954208a17efdfed1c0_livesearch_value" value="">

--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

@michael
4 years ago
7,692 posts

by 'listened for' are we in php or javascript? A jamroom listener or a jquery .on()?

SteveX
@ultrajam
4 years ago
2,583 posts

A jQuery one:

$("#mymod_profile_livesearch_value").on( "change", function() {

--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

@michael
4 years ago
7,692 posts

once the change that got added today gets out there then that could be changed to:

$(".live_search_mymod_profile").on( "change", function() {

but its not been released yet, so

var id = $('.live_search_text').attr('id');
id.on( "change", function() {

would work now and continue working after the update too PROVIDED there is only one live search on that page.

--edit--
or that may be

var id = $('.live_search_text').attr('id');
$('#' + id).on( "change", function() {

not sure, probably this.
updated by @michael: 06/15/20 03:49:21AM

SteveX
@ultrajam
4 years ago
2,583 posts

.live_search_text doesn't appear in my html

--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
updated by @ultrajam: 06/15/20 04:09:46AM

@michael
4 years ago
7,692 posts

??? its not a class on the text field?

SteveX
@ultrajam
4 years ago
2,583 posts

No, not when I look at the source, there is only this:

<input type="text" id="ls9ce955df2024e04d2cecf51dadbc70ba" class="form_text" name="ls9ce955df2024e04d2cecf51dadbc70ba" value="SteveX" tabindex="2" onfocus="if($(this).val() == 'search'){ $(this).val('').removeClass('live_search_text'); }">

--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

@michael
4 years ago
7,692 posts

Does too, not sure why that .removeClass('lve_search_text') is there. I'll need to look into it. did not notice that.

@michael
4 years ago
7,692 posts

From brian:

Quote: This is all in place to prevent Chrome from auto-filling live search fields, which breaks them. I ended up trying A LOT of things to get this working correctly - I don't remember why I'm going that with the class, but it was needed for some reason.

So the best thing to do is probably patch your sites modules/jrCore/lib/form.php

This part has changed:

    if (!empty($_field['class'])) {
        $cls .= ' ' . $_field['class'];
        $cls .= ' live_search_' . $_field['live_search_original_name'];
        unset($_field['class']);
    }

That will be there in the next core release and overwrite your patch so your code based on it will keep working.

It will give you a unique class to target that wont get removed.

SteveX
@ultrajam
4 years ago
2,583 posts

Yes, that works great!

Thanks Michael and Brian!

--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

solved livesearch field id has changed

Tags