Field auto completion on v4

[marcvander]

Hey,

I recently opened a thread regarding field auto completion for v4, but it seems it has been deleted. In my v3, I could have a field auto completion working: https://forums.nubuilder.cloud/viewtopic.php?f=19&t=9459

But when trying it on the v4, the JQuery UI library was not loading when adding it in Setup -> Header. So I tried to add it directly in the JS of the form:

Capture d’écran 2018-05-06 à 22.38.36.png

And it works, now JQuery UI library is loading. But the issue is that it doesn't look good:

Capture d’écran 2018-05-06 à 22.39.50.png

In my v3 it looked way better:

Capture d’écran 2018-05-06 à 22.40.25.png

Any idea where that could come from ?

Thanks

[toms]

You need to include the css as well.

http://learn.jquery.com/jquery-ui/getting-started/

[marcvander]

Yes indeed, somehow in the v3 it included it, but not in the v4. So for anyone interested in the answer, since I could not include JQuery UI in Setup -> Header (it did not load it), I included it directly in the form Javascript code. So under Custom Code, here is what I put:

Code: Select all

$.getScript("./jquery-ui-1.12.1.custom/jquery-ui.js", function() {
});

$('head').append('<link rel="stylesheet" type="text/css" href="./jquery-ui-1.12.1.custom/jquery-ui.min.css">');

Thanks toms !

[toms]

Could you check if this would work (Setup -> Header) ?

Code: Select all

</script>

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<style>
    
</style>

If it works, you can replace the external links with local ones.

[marcvander]

I tried, and it doesn't work, I still have the error: autocomplete is not a function

Here is how my Setup -> Header looks like:

Code: Select all

function nuHeaderTest() {

    console.log('Functions placed here before a closing script tag are available anywhere in nuBuilder Forte');

}

</script>
</script>

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<style>
    
.1nuActionButton {background:#8dbef4;}
.1nuButton {background:#8dbef4;}

</style>
<script>

[toms]

Your setup doesn't look like mine. So you tried mine and logged in again?

[marcvander]

I didn't log out and log in again. After logging in again it worked. Thanks

[admin]

.