NUI Ui opens when joining server

FiveM Resource Development & Modding Discussion
1

Im trying to create a menu for my server that opens when a user presses a key, but the ui is opens as soon as i join the server and i cant figure out why

local guiEnabled = true

function DisplayNotification(text)
	SetNotificationTextEntry("STRING")
	AddTextComponentString(text)
	DrawNotification(false, false)
end

function PrintChatMessage(text)
    TriggerEvent('chatMessage', "system", { 255, 0, 0 }, text)
end

function showGUI(enable)
    SetNuiFocus(enable)
    guiEnabled = enable

    SendNUIMessage({
        type = "showMenu",
        enable = enable
    })
end

Citizen.CreateThread(function()
    Citizen.Trace("Gui state: " .. tostring(guiEnabled))
    while true do

        if IsControlPressed(1, 39) then
            if guiEnabled == false then
                PrintChatMessage("Enabled")
			    showGUI(true)
            else
                PrintChatMessage("Disabled")
			    showGUI(false)
            end
        end

        if guiEnabled then
            DisableControlAction(0, 1, guiEnabled) -- LookLeftRight
            DisableControlAction(0, 2, guiEnabled) -- LookUpDown

            DisableControlAction(0, 142, guiEnabled) -- MeleeAttackAlternate

            DisableControlAction(0, 106, guiEnabled) -- VehicleMouseControlOverride

            if IsDisabledControlJustReleased(0, 142) then -- MeleeAttackAlternate
                SendNUIMessage({
                    type = "click"
                })
            end
        end
        Wait(0)
    end
end)
2

By the looks of it, you are only setting a variable in the script saying whether or not the menu should be open or not. (I’m just assuming this because the UI code isn’t there)

You need to add additional scripting into the ui that actually hides or displays the html element(s). You can google how to hide and show html elements as there are a few different ways to do it. Then you need to have a listener listening to that SendNUIMessage and toggle the visibility accordingly.

3

put this in the html container: style="display: none;"

6 Likes
4

Thanks that did the trick, previously i tried using javascript to .hide the elements but i flashed up briefly.

5

eVlad, the master of Js :stuck_out_tongue:
#ePhoneSoon ! :smiley:

6

Sorry, do I put this in the html head or in my css file?

7

both works

8

Alright yeah I worked that bit out right after I asked you, but then realised another error, but don’t know how to fix it…

In my webbrowsers console when opening my index.html I get the following error:

index.js:2 Uncaught ReferenceError: $ is not defined
    at index.js:2
(anonymous) @ index.js:2

Here is my index.js:

$(function () {
    function display(bool) {
        if (bool) {
            $("container").show();
        } else {
            $("container").hide();
        }
    }
    display(false)
    window.addEventListener("message", function(event) {
        var item = event.data;
        if (item.type === "ui") {
            if (item.status == true) {
                display(true)
            } else {
                display(false)
            }
        }
    })

    document.onkeyup = function (data) {
        if (data.which == 27) {
            $.post("http://vehicle-spawn/exit", JSON.stringify({}));
            return;
        }
    }

    $("#close"),click(function() {
        $.post("http://vehicle-spawn/exit", JSON.stringify({}));
        return;
    })

    $("#spawn").click(function () {
        let spawnName = $("card1").data("modelname")
        $.post("http://vehicle-spawn/spawnmodel", JSON.stringify({
            model: spawnName
        }))
        return;
    })

})

Any help GREATLY appreciated.

9

You do not have jquery installed

Add this inside the head tag

<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
10

I have that in my html… (cant access my pc right now to show you - my graphics card just decided to die…)