New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Teach elgg/Ajax to handle serialized query data #9534

Closed
hypeJunction opened this Issue Mar 22, 2016 · 6 comments

Comments

Projects
None yet
2 participants
@hypeJunction
Contributor

hypeJunction commented Mar 22, 2016

When submitting forms, it is common that request data is a serialized query string returned by $.serialize

@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay Mar 22, 2016

Member

I considered this and couldn't find an equivalent of $.unserialize. We might have to make something like Ajax.objectify(form) and recommend ppl use it, though I don't like that idea.

Member

mrclay commented Mar 22, 2016

I considered this and couldn't find an equivalent of $.unserialize. We might have to make something like Ajax.objectify(form) and recommend ppl use it, though I don't like that idea.

@hypeJunction

This comment has been minimized.

Show comment
Hide comment
@hypeJunction

hypeJunction Mar 22, 2016

Contributor

Do we really want to allow filtering of form values before the hit the server? Maybe, we don't trigger filter hooks if data is a string and just pass it as is?

Contributor

hypeJunction commented Mar 22, 2016

Do we really want to allow filtering of form values before the hit the server? Maybe, we don't trigger filter hooks if data is a string and just pass it as is?

@hypeJunction

This comment has been minimized.

Show comment
Hide comment
Contributor

hypeJunction commented Mar 22, 2016

@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay Mar 22, 2016

Member

Can you try using this function? particularly a complex form.

/**
 * Convert a form/element to a data object
 *
 * @param {HTMLElement} el HTML element
 * @returns {Object}
 */
function objectify(el) {
    // http://stackoverflow.com/a/1186309/3779
    var o = {};
    var a = $(el).serializeArray();

    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });

    return o;
}
Member

mrclay commented Mar 22, 2016

Can you try using this function? particularly a complex form.

/**
 * Convert a form/element to a data object
 *
 * @param {HTMLElement} el HTML element
 * @returns {Object}
 */
function objectify(el) {
    // http://stackoverflow.com/a/1186309/3779
    var o = {};
    var a = $(el).serializeArray();

    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });

    return o;
}
@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay Mar 22, 2016

Member

We could both skip request hook on string data, and offer that to allow data to be hookable.

Member

mrclay commented Mar 22, 2016

We could both skip request hook on string data, and offer that to allow data to be hookable.

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 22, 2016

feature(ajax): elgg/Ajax can accept serialized form data
As `jQuery.serialize` is often used to set post data, this allows a string
form of `options.data` to be passed through. In this case, however, we do
not trigger the request hook, as handlers expect an object.

Fixes #9534

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 22, 2016

feature(ajax): better elgg/Ajax handling of form data
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

In transitioning code to elgg/Ajax, it may be necessary to detect whether an
ajax request has come from it. For this we add `elgg_is_xhr2()`.

Fixes #9534
@mrclay

This comment has been minimized.

Show comment
Hide comment
@mrclay

mrclay Mar 22, 2016

Member

See #9547. I think for 2.1.x devs will have to use the function from my last comment.

Member

mrclay commented Mar 22, 2016

See #9547. I think for 2.1.x devs will have to use the function from my last comment.

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 25, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()` and `path()` accept absolute
site URLs, as one might get from `$anchor.prop('href')`.

In transitioning code to elgg/Ajax, it may be necessary to detect whether an
ajax request has come from it. For this we add `elgg_is_xhr2()`.

Fixes #9534

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 25, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()` and `path()` accept absolute
site URLs, as one might get from `$anchor.prop('href')`.

In transitioning code to elgg/Ajax, it may be necessary to detect whether an
ajax request has come from it. For this we add `elgg_is_xhr2()`.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()`, `path()`, and `form()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

In transitioning code to elgg/Ajax, it may be necessary to detect whether an
ajax request has come from it. For this we add `elgg_is_xhr2()`.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()`, `path()`, and `form()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

In transitioning code to elgg/Ajax, it may be necessary to detect whether an
ajax request has come from it. For this we add `elgg_is_xhr2()`.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()`, `path()`, and `form()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

In transitioning code to elgg/Ajax, it may be necessary to detect whether an
ajax request has come from it. For this we add `elgg_is_xhr2()`.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()`, `path()`, and `form()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()`, `path()`, and `form()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

Makes sure built-in response handler fires early, to prevent plugin handlers from
seeing these values.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()`, `path()`, and `form()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()`, `path()`, and `form()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

Fixes #9534
Fixes #9564

mrclay added a commit to mrclay/Elgg-leaf that referenced this issue Mar 26, 2016

feature(ajax): better elgg/Ajax handling of form data and URLs
As `jQuery.serialize` is often used to set post data, this change allows a
string form of `options.data` to be passed through. In this case, however,
we do not trigger the request hook, as handlers expect an object.

Because we want requests to be hookable, we nudge devs toward a new `objectify`
method, which "serializes" to an object so it can be passed through the hook.

All methods now accept a query string that gets passed to the underlying URL,
but does not appear in the hook types. `action()` and `path()` accept
absolute site URLs, as one might get from `$anchor.prop('href')`.

Fixes #9534
Fixes #9564

@mrclay mrclay closed this in #9547 Mar 26, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment