JSF 2 passing values to ManagedBean file on Checkbox Click event

Question

I Have the following code:

<h:form id="formId">
    <h:inputHidden id="x" value="#{userBean.x}" />
    <h:inputHidden id="y" value="#{userBean.y}" />
    <h:selectBooleanCheckbox event="click" listener="#{userBean.submit}" />
</h:form>
<script>
    function getVars() {
        var x = 10; 
        var y = 20;

        document.getElementById("formId:x").value = x;
        document.getElementById("formId:y").value = y;
    }
</script>

and the ManagedBean code goes as follows:

public class UserBean {
    public int x;
    public int y;

    public int getX() {
        return x;
    }

    public void setX(int x) {
        this.x = x;
    }

    public int getY() {
        return y;
    }

    public void setY(int y) {
        this.y = y;
    }

    public void submit() {
        System.out.println("x: " + x);
        System.out.println("y: " + y);
        // ...
    }

on the click event of checkbox I want the values of x & y variables to be passed to the managed bean file. How to do that?