Skip to content

GriddlyButton enhancements #7

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.

Sign up for GitHub

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

Merged
merged 5 commits into from
Oct 22, 2014
Merged

GriddlyButton enhancements #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b56596e
Added Who_Am_I wrapper
ithielnor Sep 17, 2014
f01d3e9
Revert "Added Who_Am_I wrapper"
ithielnor Sep 17, 2014
d96c873
Merge branch 'master' of https://github.com/programcsharp/griddly
ithielnor Sep 17, 2014
6531bb2
Merge branch 'master' of https://github.com/programcsharp/griddly
ithielnor Oct 22, 2014
494c125
Extracted griddly button into standalone object
ithielnor Oct 22, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions Build/CommonAssemblyInfo.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,5 +15,5 @@
//
// You can specify all the values or you can default the Revision and Build Numbers
// by using the '*' as shown below:
[assembly: AssemblyVersion("1.0.65.0")]
[assembly: AssemblyFileVersion("1.0.65.0")]
[assembly: AssemblyVersion("1.0.66.0")]
[assembly: AssemblyFileVersion("1.0.66.0")]
3 changes: 1 addition & 2 deletions Griddly.Mvc/GriddlyButton.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ public class GriddlyButton
public string Icon { get; set; }
public string ClassName { get; set; }
public string Target { get; set; }
public string ConfirmMessage { get; set; }
public bool AlignRight { get; set; }

public GriddlyButtonAction Action { get; set; }
Expand Down Expand Up @@ -47,7 +48,6 @@ public HttpVerbs Verb
switch (Action)
{
case GriddlyButtonAction.Navigate:
case GriddlyButtonAction.Report:
return HttpVerbs.Get;
case GriddlyButtonAction.Post:
case GriddlyButtonAction.PostCriteria:
Expand All @@ -70,7 +70,6 @@ public enum GriddlyButtonAction
AjaxBulk,
Post,
Modal,
Report,
PostCriteria
}
}
5 changes: 5 additions & 0 deletions Griddly/Content/griddly.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,11 @@
color: #333;
}

.griddly th.select
{
width: 22px;
}

.griddly th.sortable
{
cursor: pointer;
Expand Down
267 changes: 173 additions & 94 deletions Griddly/Scripts/griddly.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@
this.options.onRefresh = window[onRefresh];

// TODO: should we do this later on so we handle dynamically added buttons?
this.$element.find("[data-toggle=modal][href*='_griddlyIds']").each(function ()
this.$element.find("[data-griddly-toggle=modal][href*='_griddlyIds']").each(function ()
{
$(this).data("griddly-href-template", $(this).attr("href"));
});
Expand Down Expand Up @@ -274,7 +274,7 @@
else
ids = "";

this.$element.find("[data-toggle=modal]").each(function ()
this.$element.find("[data-griddly-toggle=modal]").each(function ()
{
var template = $(this).data("griddly-href-template");

Expand Down Expand Up @@ -320,98 +320,6 @@
onRowChange();
}, this));

$(this.$element).on("click", "[data-toggle=ajaxbulk]", $.proxy(function (event)
{
var url = $(event.currentTarget).data("url");
var ids = this.getSelected();

if (ids.length == 0 && $(event.currentTarget).data("enable-on-selection"))
return;

$.ajax(url,
{
data: { ids : ids },
traditional: true,
type: "POST"
}).done($.proxy(function (data, status, xhr)
{
// TODO: handle errors
// TODO: go back to first page?
this.refresh();
}, this));
}, this));

$(this.$element).on("click", "[data-toggle=post]", $.proxy(function (event)
{
var url = $(event.currentTarget).data("url");

if (!url)
url = $(event.currentTarget).attr("href");

var ids = this.getSelected();
var inputs = "";

if (ids.length == 0 && $(event.currentTarget).data("enable-on-selection"))
return;

var token = $("input[name^=__RequestVerificationToken]").first();

if (token.length)
inputs += '<input type="hidden" name="' + token.attr("name") + '" value="' + token.val() + '" />';

$.each(ids, function ()
{
inputs += "<input name=\"ids\" value=\"" + this + "\" />";
});

$("<form action=\"" + url + "\" method=\"post\">" + inputs + "</form>")
.appendTo("body").submit().remove();

return false;
}, this));

$(this.$element).on("click", "[data-toggle=postcriteria]", $.proxy(function (event)
{
var request = this.buildRequest(false);
var inputs = "";

var token = $("input[name^=__RequestVerificationToken]").first();

if (token.length)
inputs += '<input type="hidden" name="' + token.attr("name") + '" value="' + token.val() + '" />';

for (var key in request)
inputs += '<input name="' + key + '" value="' + request[key] + '" />';

var url = $(event.currentTarget).data("url");

$("<form action=\"" + url + "\" method=\"post\">" + inputs + "</form>")
.appendTo("body").submit().remove();
}, this));

$(this.$element).on("click", "[data-toggle=ajax]", $.proxy(function (event)
{
var url = $(event.currentTarget).data("url");
var ids = this.getSelected();

if (ids.length == 0)
return;

for (var i = 0; i < ids.length; i++)
{
$.ajax(url,
{
data: { id: ids[i] },
type: "POST"
}).done($.proxy(function (data, status, xhr)
{
// TODO: handle errors
// TODO: go back to first page?
this.refresh();
}, this));
}
}, this));

$("a.export-xlsx", this.$element).on("click", $.proxy(function (e) {
this.exportFile("xlsx");
e.preventDefault();
Expand Down Expand Up @@ -922,9 +830,180 @@
rowClickModal: null
};

var GriddlyButton = function (element, options) {
this.$element = $(element);
this.options = options;

this.create();

if ($(this.$element).is("[data-enable-on-selection=true]")) {
$(this.$element).addClass("disabled");
}
};

GriddlyButton.prototype = {
constructor: GriddlyButton,

// create and bind
create: function () {
var griddly = this.$element.closest("[data-role=griddly]");
var url = this.$element.data("url");
var toggle = this.$element.data("toggle");
var onclick = this.$element.data("onclick");
var confirmMessage = this.$element.data("confirm-message");
var enableOnSelection = this.$element.data("enable-on-selection");

$(this.$element).on("click", $.proxy(function (event) {
if ((typeof confirmMessage === "undefined" || confirm(confirmMessage))) {
if ($(this.$element).triggerHandler("beforeExecute") !== false) {
if (toggle && ["ajaxbulk", "postcriteria", "ajax", "post"].indexOf(toggle) > -1) {
if (!url)
url = $(event.currentTarget).attr("href");

var ids = {};
if (griddly)
ids = $(griddly).griddly("getSelected");

switch (toggle) {
case "ajaxbulk":
if (ids.length == 0 && enableOnSelection)
return;
return this.ajaxBulk(url, ids);

case "post":
if (ids.length == 0 && enableOnSelection)
return;
return this.post(url, ids);

case "postcriteria":
if (!griddly)
return;
return this.postCriteria(url, $(griddly).griddly("buildRequest"));

case "ajax":
if (ids.length == 0)
return;
return this.ajax(url, ids);
}
}

if (onclick) {
var f = window[onclick];
if ($.isFunction(f))
return f.call(this.$element);
throw "onclick must be a global function";
// we do not support eval cause it's insecure
}

return true;
}
}

return false;
}, this));
},

ajaxBulk: function (url, ids) {
$.ajax(url,
{
data: { ids: ids },
traditional: true,
type: "POST"
}).done($.proxy(function (data, status, xhr) {
// TODO: handle errors
// TODO: go back to first page?
this.refresh();

$(this.$element).triggerHandler("afterExecute", [data, status, xhr]);
}, this));
},

post: function (url, ids) {
var inputs = "";

var token = $("input[name^=__RequestVerificationToken]").first();

if (token.length)
inputs += '<input type="hidden" name="' + token.attr("name") + '" value="' + token.val() + '" />';

$.each(ids, function () {
inputs += "<input name=\"ids\" value=\"" + this + "\" />";
});

$("<form action=\"" + url + "\" method=\"post\">" + inputs + "</form>")
.appendTo("body").submit().remove();

return false;
},

postCriteria: function (url, request) {
var inputs = "";

var token = $("input[name^=__RequestVerificationToken]").first();

if (token.length)
inputs += '<input type="hidden" name="' + token.attr("name") + '" value="' + token.val() + '" />';

for (var key in request)
inputs += '<input name="' + key + '" value="' + request[key] + '" />';

$("<form action=\"" + url + "\" method=\"post\">" + inputs + "</form>")
.appendTo("body").submit().remove();
},

ajax: function (url, ids) {
for (var i = 0; i < ids.length; i++) {
$.ajax(url,
{
data: { id: ids[i] },
type: "POST"
}).done($.proxy(function (data, status, xhr) {
// TODO: handle errors
// TODO: go back to first page?
this.refresh();

$(this.$element).triggerHandler("afterExecute", [data, status, xhr]);
}, this));
}
},
};

$.fn.griddlyButton = function (option, parameter) {
var value;
var args = arguments;

this.each(function () {
var data = $(this).data('griddly'),
options = typeof option == 'object' && option;

// initialize griddly button
if (!data) {
var instanceOptions = $.extend({}, $.fn.griddlyButton.defaults, options);

$(this).data('griddly', (data = new GriddlyButton(this, instanceOptions)));
}

// call griddly method
if (typeof option == 'string') {
value = data[option].apply(data, Array.prototype.slice.call(args, 1));
}

});

if (value !== undefined)
return value;
else
return this;
};

$.fn.griddlyButton.defaults =
{
};

$(function()
{
$("[data-role=griddly]").griddly();
$("[data-role=griddly-button]").griddlyButton();

// patch stupid bootstrap js so it doesn't .empty() our inline filter dropdowns
// remove once bs fixes: https://github.com/twbs/bootstrap/pull/14244
Expand Down
16 changes: 9 additions & 7 deletions Griddly/Views/Home/TestGrid.cshtml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,14 @@
PageSize = 5

}
.SelectColumn(x => x.ToString())
.Column(x => x.FirstName, "First Name")
.Column(x => x.LastName, "Last Name", defaultSort: SortDirection.Ascending)
.Column(x => x.Company, "Company")
.Column(x => x.Address, "Address")
.Column(x => x.City, "City")
.Column(x => x.State, "State")
.TemplateColumn(x => Html.ActionLink("&" + x.PostalCode, "Profile"), "Zip")
.Button("", "export", action: GriddlyButtonAction.Javascript, className: "export-xlsx")
.Column(x => x.LastName, "Last Name", defaultSort: SortDirection.Ascending)
.Column(x => x.Company, "Company")
.Column(x => x.Address, "Address")
.Column(x => x.City, "City")
.Column(x => x.State, "State")
.TemplateColumn(x => Html.ActionLink("&" + x.PostalCode, "Profile"), "Zip")
.Button("", "export", action: GriddlyButtonAction.Javascript, className: "export-xlsx")
.Add(new GriddlyButton() { Text = "Confirm", Argument = "http://google.com", Action = GriddlyButtonAction.PostCriteria, ConfirmMessage = "Please confirm" })
)
Loading