intercooler-js icon indicating copy to clipboard operation
intercooler-js copied to clipboard

ic-push-url not working return

Open mrGrochowski opened this issue 7 years ago • 5 comments

Related to https://github.com/LeadDyno/intercooler-js/issues/77#issuecomment-174027468 Can You show me example of X-IC-PushURL ? @carsongross I can't make it work in client-side script only. My backend dev w on't hear about return special http headers.

For me if some field is sent by GET method it have to appear in url adress like in simple <a ic-src=''></a> url..

There is code example of my project (new lines only for readability):

<form ic-push-url="true" 
action="index.php" 
ic-get-from="index.php" 
ic-target="#content" 
ic-select-from-response="#content" 
method="GET" 
id="form">
	<input type="hidden" name="co"       value="{{switch}}" />
	<input type="hidden" name="akcja"    value="{{akcja}}" />
	<input type="hidden" name="segment"  value="{{GETsegment}}" />
	<input type="hidden" name="spolka"   value="{{GETspolka}}" />
	<input type="hidden" name="doradca"  value="{{GETdoradca}}" /> 
	<select              name="okres"    id="select-okres">
	    {% for item in arr %}
	        <option value="{{item.id}}" 
		{% if item.id == GETokres %} selected="selected" {% endif %}>
                {{item.nazwa}} 
            </option>
	    {% endfor %}
	</select>
</form>

or

<form ic-push-url="true" 
action="index.php" 
ic-get-from="index.php?co={{switch}}
&akcja={{akcja}}
&segment={{GETsegment}}
&spolka={{GETspolka}}
&doradca={{GETdoradca}}" // as you see I can't put &okres={{GETokres}} field becouse i send double times 
ic-target="#content" 
ic-select-from-response="#content" 
method="GET" 
id="form">
	//<input type="hidden" name="co" value="{{switch}}" />
	//<input type="hidden" name="akcja" value="{{akcja}}" />
	//<input type="hidden" name="segment" value="{{GETsegment}}" />
	//<input type="hidden" name="spolka" value="{{GETspolka}}" />
	//<input type="hidden" name="doradca" value="{{GETdoradca}}" /> 
    <select name="okres" id="select-okres">
	    {% for item in arr %}
	        <option value="{{item.id}}" {% if item.id == GETokres %} selected="selected" {% endif %}>
                {{item.nazwa}} 
            </option>
	    {% endfor %}
	</select>
</form>

mrGrochowski avatar Mar 07 '18 10:03 mrGrochowski

Hi There,

If you are using a select for navigation, intercooler isn't going to pick up the parameters with a client-side ic-push-url. Are normal anchors a possibility?

1cg avatar Mar 15 '18 17:03 1cg

No. This case require select fiters.

Carson I resolve problem with few lines of code. Intercooler is gorgeous tool and maybe You have to consider about checking, is form element includs method==GET and ic-push-url. Then serialize using jQuery method (what You already included ). On last put resault to ic-src and let code work.

above implement pubsub lib
App.IntercoolerHelper = (function () {

    var init = function (params) {
        var _params = params || {
            element: "form",
            events: "select change",
            property: "[ic-push-url][ic-src][method*=get] , [ic-push-url][ic-src][method*=GET] "
        };

        PubSub.publish("/IntercoolerHelper/init", {
            element: $(_params.element),
            events: _params.events,
            property: _params.property
        });

    }

    var _checkAttrib = PubSub.subscribe("/IntercoolerHelper/init", function (params) {
        var _params = params || {
            property: "[*=*]"
        };
        var $fulfillingElems = _params.element.map(function () {
            return $(this).is(_params.property) ? $(this) : "";
        })
        _params.element = $fulfillingElems;

        PubSub.publish("/IntercoolerHelper/thatFormsAvailbe", _params);

    });


    var listener = function (params) {
        var _params = params || {};

        _params.element.each(function () {
            $(this).on(_params.events, function (e) {
                _params.element = $(this);
                PubSub.publish('/IntercoolerHelper/eventOccur', _params);
            });
        })
    }
    
    var _listener = PubSub.subscribe("/IntercoolerHelper/thatFormsAvailbe", listener );

    var _replaceICsrc = PubSub.subscribe("/IntercoolerHelper/eventOccur", function (params) {
        var _params = params || {};

        _params.element.each(function () {
            $(this).attr("ic-src", "" + $(this).attr('action') + "?" + $(this).serialize());
            $(this).attr("ic-get-from", "" + $(this).attr('action') + "?" + $(this).serialize());
        });

    });

    return {
        init: init,
        listener:listener
    }
})();

and


App.instance_IntercoolerHelper = App.IntercoolerHelper;


$(document).ready(function () {

    $("form select").on("select change", function () {
        $(this).parents("form").submit();
    });
    iCRMApp.instance_IntercoolerHelper.init();


    Intercooler.ready(function () {
        iCRMApp.instance_IntercoolerHelper.init();
        
        $("form select").on("select change", function () {
            $(this).parents("form").submit();
        });

    });
});

mrGrochowski avatar Mar 19 '18 15:03 mrGrochowski

:) I have always felt this was a shortcoming, but I also don't want to include every variable in the URL when it is a GET. Maybe we should have an additional attribute, something like ic-push-parameters="foo, bar" that you can use to specify the parameters that should be pushed?

What do you think?

1cg avatar Mar 19 '18 18:03 1cg

Thas looks promising but in condition if I can set ic-push-parameters="*"

mrGrochowski avatar Mar 20 '18 07:03 mrGrochowski

How it's goin ?

mrGrochowski avatar Apr 12 '18 08:04 mrGrochowski