Backbone.js - Quelle est la meilleure façon de vérifier une case à cocher

Ma colonne vertébrale modèle a une valeur booléenne (isRegistered). Quand j'ai rendu la vue, je veux avoir une case à cocher activée ou désactivée en fonction de la valeur vrai/faux de la valeur de type boolean.

Mon effort actuel ressemble à ça:

<input id="isRegisteredCheckbox" checked="<%= isRegistered ? 'checked': ''"/>

cela ne fonctionne pas, car, selon la Spécification du W3C l'objet d'attribut doit être complètement supprimé de décocher une case à cocher.

Comment puis-je le faire à l'aide de la dorsale modèle?

<input type="checkbox" <%= élément.visible ? "checked" : "" %> value="<%= élément.id %>"/>

OriginalL'auteur reach4thelasers | 2012-04-25

  1. 7

    Vous n'avez pas besoin de la checked= partie. il suffit d'imprimer vérifié dans la balise si elle a besoin d'être vérifié.

    MODIFIER

    Maintenant que nous avons déterminé que juste l'impression de "vérifié" est valide en html, vous pouvez essayer pour la simplicité:

    rendu:

    var registered;
var tmpl = _.template(your template);
isRegistered ? registered = 'checked' : registered = '';
var tmpl_data = _.extend(this.model.toJSON(), {registered: registered}); //or whatever values you need to add
$(this.el).html(tmpl(tmpl_data));

    modèle:

    <input type="checkbox" {{ registered }}>

    Pas besoin de désordre des instructions conditionnelles dans votre modèle à l'aide de cette méthode.

    Alors votre suggestion sera rendu dans les navigateurs, les OP mentionné "W3C specs'. Selon la spec, il est fait référence à l'attribut checked peut nécessiter une valeur correspondante (même si son "").
    il est valide en HTML 4 Stricte, HTML 4 Transitoire et HTML5. Je veux dire, je suppose que c'est possible, il n'est pas valable dans le HTML4, mais, l'homme si HTML4 strict & transition, ET html 5 ne sont pas "W3C specs", je ne suis pas sûr de ce qui constitue les spécifications du W3C.
    er, faire en sorte que "pas valide en html 3"... ou, gulp, xhtml...
    Cela fonctionne dans tous les navigateurs que nous sommes inmplementing pour la quasi - >IE6 certainement la plus simple et la plus élégante de réponse trop
    Je pensais xhtml ..c'était à la mode quand j'étais gamin:-) j'ai regardé le code html 4/5 spécifications de nouveau, et n'avait pas réalisé qu'il permet à la fois les états et les versions de long d'attributs booléens.

    OriginalL'auteur tkone

  2. 8

    Vous pouvez utiliser un test de joindre checked='checked'

    <input id="isRegisteredCheckbox" <% if (isRegistered) { %>checked="checked"<% } %> />

    OriginalL'auteur nikoshr

  3. 1

    J'ai l'habitude d'utiliser un Decorator pour ce cas. J'expose ici un exemple de la façon dont il peut ressembler à:

    //code simplified and not tested
var MyModelDecorator = Backbone.Model.extend({
  initialize: function( opts ){
    this.model = opts.model;
  },

  toJSON: function(){
    var json =
      _.extend(
        this.model.toJSON(),
        {
          checked: this.checked(),
          css_classes: this.cssClasses()
        }
      );

    return json;
  },

  checked: function(){
    result = "";
    if( this.model.get( "checked" ) ) result += "checked=\"true\"";
    return result;
  },

  cssClasses: function(){
    result = "";
    if( this.model.get( "checked" ) )         result += " checked";
    if( this.model.get( "key" ) == "value" )  result += " important";
    return result;
  }
});

    J'ai ajouté un supplément de css_classes décorateur attribut de sorte que vous pouvez le voir, cette approche peut être une solution commune pour plusieurs situations.

    Votre View.render peut ressembler à ceci:

    //code simplified and not tested
var myView = Backbone.View.extend({
  template: _.template( "<input id=\"isRegisteredCheckbox\" <%= checked %> class=\"<%= css_classes %>\" />" ),

  render: function(){
    var decorator = new MyModelDecorator({ model: this.model });
    this.$el.html( this.template( decorator.toJSON() ) );
  }
});

    OriginalL'auteur fguillen

  4. 1

    Ici est une façon très simple de le faire.

    <input <% if(isRegistered) print("CHECKED"); %>  type="checkbox" id="isRegisteredCheckbox" />

    Notez que j'utilise <% et non pas <%= pour la condition.

    Vous pourriez tout simplement la valeur de isRegistered "VÉRIFIÉ" ou "" dans votre modèle et l'appel

    <input id="isRegisteredCheckbox" <%= registered %> />

    avec quelque chose comme 

    serialize: function() {
  var isChecked = (isRegistered) ? "CHECKED" : "";
  return {registered : ischecked};
},

    OriginalL'auteur J D

  5. 0

    J'ai eu un problème similaire où j'ai hérité de quelqu'un Django + hamlpy (HAML) + Backbone.js + Undescore.js avec Moustache modèles (quel gâchis!)

    Haml de traitement dans hamlpy n'a pas exactement comme:

    %input{ :checked => {{isChecked}} ? true : None }

    Ou quelque chose de similaire. J'ai eu un Django hamlpy stacktrace.

    J'ai réussi à pirater l'aide de Moustache inversé sections (voir: http://mustache.github.com/mustache.5.html)

    {#isChecked}
%input{:checked => 'true' }
{/isChecked}
{^isChecked}
 %input{ ... without the checked attribute ... }
{/isChecked}

    De toute façon, de l'espoir, qui permet à certains pauvres Googleurs de perdre des heures de leur force de vie!

    OriginalL'auteur raf