diff --git a/dist/jquery.loadTemplate.js b/dist/jquery.loadTemplate.js index e89c24b..de8e3d8 100644 --- a/dist/jquery.loadTemplate.js +++ b/dist/jquery.loadTemplate.js @@ -323,8 +323,10 @@ $elem.attr("id", applyFormatters($elem, value, "id", settings)); }); - - + processElements("data-css", template, data, settings, function ($elem, value) { + $elem.css(applyFormatters($elem, value, "css", settings)) + }); + processElements("data-class", template, data, settings, function ($elem, value) { $elem.addClass(applyFormatters($elem, value, "class", settings)); }); diff --git a/dist/jquery.loadTemplate.min.js b/dist/jquery.loadTemplate.min.js index c0311fc..c418890 100644 --- a/dist/jquery.loadTemplate.min.js +++ b/dist/jquery.loadTemplate.min.js @@ -1 +1 @@ -(function(a){var w={},v={},h={},m;function o(G,C,E){var B=this,A,D,F;C=C||{};F=a.extend(true,{async:true,overwriteCache:false,complete:null,success:null,error:function(){a(this).each(function(){a(this).html(F.errorMessage)})},errorMessage:"There was an error loading the template.",paged:false,pageNo:1,elemPerPage:10,append:false,prepend:false,beforeInsert:null,afterInsert:null,bindingOptions:{ignoreUndefined:false,ignoreNull:false,ignoreEmptyString:false}},E);if(a.type(C)==="array"){m=true;return t.call(this,G,C,F)}if(!g(G)){A=a(G);if(typeof G==="string"&&G.indexOf("#")===0){F.isFile=false}}D=F.isFile||(typeof F.isFile==="undefined"&&(typeof A==="undefined"||A.length===0));if(D&&!F.overwriteCache&&w[G]){r(G,B,C,F)}else{if(D&&!F.overwriteCache&&w.hasOwnProperty(G)){c(G,B,C,F)}else{if(D){n(G,B,C,F)}else{p(A,B,C,F)}}}return this}function b(B,A){if(A){h[B]=A}else{h=a.extend(h,B)}}function g(A){return typeof A==="string"&&A.indexOf("/")>-1}function t(K,B,H){H=H||{};var A=this,L=B.length,D=H.prepend&&!H.append,C=0,J=0,E=false,F=[],G;if(H.paged){var I=(H.pageNo-1)*H.elemPerPage;B=B.slice(I,I+H.elemPerPage);L=B.length}if(!H.append&&!H.prepend){A.html("")}G=a.extend({},H,{append:!H.prepend&&true,complete:function(M){C++;if(C===L||E){if(E&&H&&typeof H.error==="function"){H.error.call(A,F)}if(H&&typeof H.complete==="function"){H.complete()}}},success:function(){J++;if(J===L){if(H&&typeof H.success==="function"){H.success()}}},error:function(M){E=true;F.push(M)}});if(D){B.reverse()}a(B).each(function(){o.call(A,K,this,G);if(E){return false}});return this}function c(D,B,A,C){if(v[D]){v[D].push({data:A,selection:B,settings:C})}else{v[D]=[{data:A,selection:B,settings:C}]}}function r(E,C,B,D){var A=w[E].clone();q.call(C,A,B,D);if(typeof D.success==="function"){D.success()}}function x(){return new Date().getTime()}function y(A){if(A.indexOf("?")!==-1){return A+"&_="+x()}else{return A+"?_="+x()}}function n(D,B,A,C){w[D]=null;var E=D;if(C.overwriteCache){E=y(E)}a.ajax({url:E,async:C.async,success:function(F){l(a(F),D,B,A,C)},error:function(F){k(D,B,A,C,F)}})}function p(A,C,B,D){if(A.is("script")||A.is("template")){A=a.parseHTML(a.trim(A.html()))}q.call(C,A,B,D);if(typeof D.success==="function"){D.success()}}function q(C,A,B){var C=a("
").append(C);f(C,A,B);a(this).each(function(){var D=C.children().clone(true);a("select",D).each(function(E,F){a(this).val(a("select",C).eq(E).val())});if(B.beforeInsert){B.beforeInsert(D,A)}if(B.append){a(this).append(D)}else{if(B.prepend){a(this).prepend(D)}else{a(this).html("").append(D)}}if(B.afterInsert){B.afterInsert(D,A)}});if(typeof B.complete==="function"){B.complete.call(a(this),A)}}function k(E,C,A,D,B){var F;if(typeof D.error==="function"){D.error.call(C,B)}a(v[E]).each(function(G,H){if(typeof H.settings.error==="function"){H.settings.error.call(H.selection,B)}});if(typeof D.complete==="function"){D.complete.call(C)}while(v[E]&&(F=v[E].shift())){if(typeof F.settings.complete==="function"){F.settings.complete.call(F.selection)}}if(typeof v[E]!=="undefined"&&v[E].length>0){v[E]=[]}}function l(A,E,C,B,D){var F;w[E]=A.clone();q.call(C,A,B,D);if(typeof D.success==="function"){D.success.call(C)}while(v[E]&&(F=v[E].shift())){q.call(F.selection,w[E].clone(),F.data,F.settings);if(typeof F.settings.success==="function"){F.settings.success.call(F.selection)}}}function f(C,A,B){A=A||{};u("data-content",C,A,B,function(D,E){D.html(e(D,E,"content",B))});u("data-content-append",C,A,B,function(D,E){D.append(e(D,E,"content",B))});u("data-content-prepend",C,A,B,function(D,E){D.prepend(e(D,E,"content",B))});u("data-content-text",C,A,B,function(D,E){D.text(e(D,E,"content",B))});u("data-innerHTML",C,A,B,function(D,E){D.html(e(D,E,"content",B))});u("data-src",C,A,B,function(D,E){D.attr("src",e(D,E,"src",B))},function(D){D.remove()});u("data-href",C,A,B,function(D,E){D.attr("href",e(D,E,"href",B))},function(D){D.remove()});u("data-alt",C,A,B,function(D,E){D.attr("alt",e(D,E,"alt",B))});u("data-id",C,A,B,function(D,E){D.attr("id",e(D,E,"id",B))});u("data-class",C,A,B,function(D,E){D.addClass(e(D,E,"class",B))});u("data-link",C,A,B,function(D,F){var E=a("");E.attr("href",e(D,F,"link",B));E.html(D.html());D.html(E)});u("data-link-wrap",C,A,B,function(D,F){var E=a("");E.attr("href",e(D,F,"link-wrap",B));D.wrap(E)});u("data-options",C,A,B,function(D,E){a(E).each(function(){var F=a("");F.attr("value",this).text(this).appendTo(D)})});s(C,A,B);u("data-value",C,A,B,function(D,E){D.val(e(D,E,"value",B))})}function u(A,F,B,E,C,D){a("["+A+"]",F).each(function(){var G=a(this),H=G.attr(A),I=j(B,H);if(!z(G,I,E)){G.remove();return}G.removeAttr(A);if(typeof I!=="undefined"&&C){C(G,I)}else{if(D){D(G)}}});return}function z(B,D,C){var A=i(B,C);if(A.ignoreUndefined&&typeof D==="undefined"){return false}else{if(A.ignoreNull&&D===null){return false}else{if(A.ignoreEmptyString&&D===""){return false}else{return true}}}}function i(B,C){var A={};if(B instanceof jQuery&&B.attr("data-binding-options")){A=a.parseJSON(B.attr("data-binding-options"));B.removeAttr("data-binding-options")}else{if(typeof B==="object"&&B.hasOwnProperty("bindingOptions")){A=B.bindingOptions}}return a.extend({},C.bindingOptions,A)}function s(C,A,B){a("[data-template-bind]",C).each(function(){var D=a(this),E=a.parseJSON(D.attr("data-template-bind"));D.removeAttr("data-template-bind");a(E).each(function(){var G;if(typeof(this.value)==="object"){G=j(A,this.value.data)}else{G=j(A,this.value)}if(this.attribute){if(!z(this,G,B)){D.remove();return}switch(this.attribute){case"content":case"innerHTML":D.html(d(D,G,this));break;case"contentAppend":D.append(d(D,G,this));break;case"contentPrepend":D.prepend(d(D,G,this));break;case"contentText":D.text(d(D,G,this));break;case"options":var F=this;a(G).each(function(){var H=a("");H.attr("value",this[F.value.value]).text(d(D,this[F.value.content],F)).attr("selected",typeof this[F.value.selected]==undefined?false:this[F.value.selected]).appendTo(D)});break;default:D.attr(this.attribute,d(D,G,this))}}})})}function d(A,D,B,C){if(B.formatter&&h[B.formatter]){return(function(E){return h[B.formatter].call(A,D,B.formatOptions,E)})(C)}return D}function j(A,B){if(B==="this"){return A}var C=B.split("."),D,E=A;while((D=C.shift())&&typeof E!=="undefined"&&E!=null){E=E[D]}return E}function e(A,G,B,F){var E=A.attr("data-format-target"),D;if(E===B||(!E&&B==="content")){D=A.attr("data-format");if(D&&typeof h[D]==="function"){var C=A.attr("data-format-options");return(function(H){return h[D].call(A[0],G,C,a.extend({},H))})(F)}}return G}b("nestedTemplateFormatter",function(E,B,A){if(!B){return}if(typeof B==="string"&&B[0]==="{"){B=a.parseJSON(B)}var C=B.parentElement||"div";var D=B.template||B;if(B.parentElement){return a("<"+C+"/>").loadTemplate(D,E,A)}else{return a("<"+C+"/>").loadTemplate(D,E,A).children()}});a.fn.loadTemplate=o;a.addTemplateFormatter=b})(jQuery); \ No newline at end of file +!function(t){"use strict";function e(e,n,c){var s,u,p,d=this;return n=n||{},p=t.extend(!0,{async:!0,overwriteCache:!1,complete:null,success:null,error:function(){t(this).each(function(){t(this).html(p.errorMessage)})},errorMessage:"There was an error loading the template.",paged:!1,pageNo:1,elemPerPage:10,append:!1,prepend:!1,beforeInsert:null,afterInsert:null,bindingOptions:{ignoreUndefined:!1,ignoreNull:!1,ignoreEmptyString:!1}},c),"array"===t.type(n)?(T=!0,r.call(this,e,n,p)):(a(e)||(s=t(e),"string"==typeof e&&0===e.indexOf("#")&&(p.isFile=!1)),u=p.isFile||"undefined"==typeof p.isFile&&("undefined"==typeof s||0===s.length),u&&!p.overwriteCache&&w[e]?o(e,d,n,p):u&&!p.overwriteCache&&w.hasOwnProperty(e)?i(e,d,n,p):u?l(e,d,n,p):f(s,d,n,p),this)}function n(e,n){n?P[e]=n:P=t.extend(P,e)}function a(t){return"string"==typeof t&&t.indexOf("/")>-1}function r(n,a,r){r=r||{};var i,o=this,c=a.length,s=r.prepend&&!r.append,l=0,f=0,u=!1,p=[];if(r.paged){var d=(r.pageNo-1)*r.elemPerPage;a=a.slice(d,d+r.elemPerPage),c=a.length}return r.append||r.prepend||o.html(""),i=t.extend({},r,{append:!r.prepend&&!0,complete:function(t){l++,(l===c||u)&&(u&&r&&"function"==typeof r.error&&r.error.call(o,p),r&&"function"==typeof r.complete&&r.complete())},success:function(){f++,f===c&&r&&"function"==typeof r.success&&r.success()},error:function(t){u=!0,p.push(t)}}),s&&a.reverse(),t(a).each(function(){return e.call(o,n,this,i),u?!1:void 0}),this}function i(t,e,n,a){k[t]?k[t].push({data:n,selection:e,settings:a}):k[t]=[{data:n,selection:e,settings:a}]}function o(t,e,n,a){var r=w[t].clone();u.call(e,r,n,a),"function"==typeof a.success&&a.success()}function c(){return(new Date).getTime()}function s(t){return-1!==t.indexOf("?")?t+"&_="+c():t+"?_="+c()}function l(e,n,a,r){w[e]=null;var i=e;r.overwriteCache&&(i=s(i)),t.ajax({url:i,async:r.async,success:function(i){d(t(i),e,n,a,r)},error:function(t){p(e,n,a,r,t)}})}function f(e,n,a,r){(e.is("script")||e.is("template"))&&(e=t.parseHTML(t.trim(e.html()))),u.call(n,e,a,r),"function"==typeof r.success&&r.success()}function u(e,n,a){var e=t("").append(e);h(e,n,a),t(this).each(function(){var r=e.children().clone(!0);t("select",r).each(function(n,a){t(this).val(t("select",e).eq(n).val())}),a.beforeInsert&&a.beforeInsert(r,n),a.append?t(this).append(r):a.prepend?t(this).prepend(r):t(this).html("").append(r),a.afterInsert&&a.afterInsert(r,n)}),"function"==typeof a.complete&&a.complete.call(t(this),n)}function p(e,n,a,r,i){var o;for("function"==typeof r.error&&r.error.call(n,i),t(k[e]).each(function(t,e){"function"==typeof e.settings.error&&e.settings.error.call(e.selection,i)}),"function"==typeof r.complete&&r.complete.call(n);k[e]&&(o=k[e].shift());)"function"==typeof o.settings.complete&&o.settings.complete.call(o.selection);"undefined"!=typeof k[e]&&k[e].length>0&&(k[e]=[])}function d(t,e,n,a,r){var i;for(w[e]=t.clone(),u.call(n,t,a,r),"function"==typeof r.success&&r.success.call(n);k[e]&&(i=k[e].shift());)u.call(i.selection,w[e].clone(),i.data,i.settings),"function"==typeof i.settings.success&&i.settings.success.call(i.selection)}function h(e,n,a){n=n||{},v("data-content",e,n,a,function(t,e){t.html(O(t,e,"content",a))}),v("data-content-append",e,n,a,function(t,e){t.append(O(t,e,"content",a))}),v("data-content-prepend",e,n,a,function(t,e){t.prepend(O(t,e,"content",a))}),v("data-content-text",e,n,a,function(t,e){t.text(O(t,e,"content",a))}),v("data-innerHTML",e,n,a,function(t,e){t.html(O(t,e,"content",a))}),v("data-src",e,n,a,function(t,e){t.attr("src",O(t,e,"src",a))},function(t){t.remove()}),v("data-href",e,n,a,function(t,e){t.attr("href",O(t,e,"href",a))},function(t){t.remove()}),v("data-alt",e,n,a,function(t,e){t.attr("alt",O(t,e,"alt",a))}),v("data-id",e,n,a,function(t,e){t.attr("id",O(t,e,"id",a))}),v("data-css",e,n,a,function(t,e){t.css(O(t,e,"css",a))}),v("data-class",e,n,a,function(t,e){t.addClass(O(t,e,"class",a))}),v("data-link",e,n,a,function(e,n){var r=t("");r.attr("href",O(e,n,"link",a)),r.html(e.html()),e.html(r)}),v("data-link-wrap",e,n,a,function(e,n){var r=t("");r.attr("href",O(e,n,"link-wrap",a)),e.wrap(r)}),v("data-options",e,n,a,function(e,n){t(n).each(function(){var n=t("");n.attr("value",this).text(this).appendTo(e)})}),y(e,n,a),v("data-value",e,n,a,function(t,e){t.val(O(t,e,"value",a))})}function v(e,n,a,r,i,o){t("["+e+"]",n).each(function(){var n=t(this),c=n.attr(e),s=x(a,c);return m(n,s,r)?(n.removeAttr(e),void("undefined"!=typeof s&&i?i(n,s):o&&o(n))):void n.remove()})}function m(t,e,n){var a=g(t,n);return a.ignoreUndefined&&"undefined"==typeof e?!1:a.ignoreNull&&null===e?!1:a.ignoreEmptyString&&""===e?!1:!0}function g(e,n){var a={};return e instanceof jQuery&&e.attr("data-binding-options")?(a=t.parseJSON(e.attr("data-binding-options")),e.removeAttr("data-binding-options")):"object"==typeof e&&e.hasOwnProperty("bindingOptions")&&(a=e.bindingOptions),t.extend({},n.bindingOptions,a)}function y(e,n,a){t("[data-template-bind]",e).each(function(){var e=t(this),r=t.parseJSON(e.attr("data-template-bind"));e.removeAttr("data-template-bind"),t(r).each(function(){var r;if(r="object"==typeof this.value?x(n,this.value.data):x(n,this.value),this.attribute){if(!m(this,r,a))return void e.remove();switch(this.attribute){case"content":case"innerHTML":e.html(b(e,r,this));break;case"contentAppend":e.append(b(e,r,this));break;case"contentPrepend":e.prepend(b(e,r,this));break;case"contentText":e.text(b(e,r,this));break;case"options":var i=this;t(r).each(function(){var n=t("");n.attr("value",this[i.value.value]).text(b(e,this[i.value.content],i)).attr("selected",void 0==typeof this[i.value.selected]?!1:this[i.value.selected]).appendTo(e)});break;default:e.attr(this.attribute,b(e,r,this))}}})})}function b(t,e,n,a){return n.formatter&&P[n.formatter]?function(a){return P[n.formatter].call(t,e,n.formatOptions,a)}(a):e}function x(t,e){if("this"===e)return t;for(var n,a=e.split("."),r=t;(n=a.shift())&&"undefined"!=typeof r&&null!=r;)r=r[n];return r}function O(e,n,a,r){var i,o=e.attr("data-format-target");if((o===a||!o&&"content"===a)&&(i=e.attr("data-format"),i&&"function"==typeof P[i])){var c=e.attr("data-format-options");return function(a){return P[i].call(e[0],n,c,t.extend({},a))}(r)}return n}var T,w={},k={},P={};n("nestedTemplateFormatter",function(e,n,a){if(n){"string"==typeof n&&"{"===n[0]&&(n=t.parseJSON(n));var r=n.parentElement||"div",i=n.template||n;return n.parentElement?t("<"+r+"/>").loadTemplate(i,e,a):t("<"+r+"/>").loadTemplate(i,e,a).children()}}),t.fn.loadTemplate=e,t.addTemplateFormatter=n}(jQuery); \ No newline at end of file diff --git a/readme.md b/readme.md index 629ce3a..3b0970f 100644 --- a/readme.md +++ b/readme.md @@ -110,6 +110,7 @@ There are a number of different bindings and ways to bind the data. The followin - "data-alt" - sets the alt value of the element to the value provided (uses $(elem).attr("alt", value)); - "data-value" - sets the value attribute of the element to the value provided (uses $(elem).val(value)) - "data-class" - sets the class attribute of the element to the value provided (uses $(elem).class(value)) +- "data-css" - sets the CSS attribute of the element to the value provided (uses $(elem).css(value)) - "data-link" - sets the innerHtml of the element to be a link to the value provided (wraps the content in an <a> tag). - "data-link-wrap" - wraps the element in a link to the value provided. Same as "data-link", but the <a> tag wraps the element as well as the content. - "data-options" - adds options to a select box. The value for this should reference an array of strings, each option will be output as a separate option. The value will be the same as the displayed text for each option. For a more powerful version of this look at the data-template-bind option.