Ankündigung

Einklappen
Keine Ankündigung bisher.

button onclick erweitern?

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • button onclick erweitern?

    Hi,
    über eine mysql-abfrage erstelle ich mehrere Button mit kleinen Bildern darauf. Je nachdem welcher Button nun geklickt wird, wird das entsprechende Bild als grössere Graphik daneben angezeigt. Soweit klappt das auch ganz prima.

    Mein Problem ist nun: Zu jedem anzuzeigendem großem Bild gehören nun auch ergänzende Informationen die je nach ausgewähltem Button zusätzlich angezeigt werden sollen.

    Wie kann ich nun den angeklickten Button ermitteln um über mysql die fehlenden Daten nachzuladen. Oder anderst gefragt kann man den verschiedenen Button's bereits bei der Erstellung zusätzliche Variablen-Inhalte (also nicht nur das "Kleinbild") mitgeben?
    Danke für jede Idee.
    halweks

  • #2
    man kann die infos(also auch das img src attribute) in ein model packen und dann mit backbone rumspielen:
    http://coenraets.org/blog/2011/12/ba...tting-started/

    restfull api und so zeugs ist da auch verlinkt. das demo finde ich grad nicht

    Kommentar


    • #3
      Danke für die flotte Antwort.
      Ob ich da jedoch wirklich durchsteige ist fraglich. Fraglich weil ich kein englisch (leider) spreche.
      Sollte es noch einen deutschen Ansatz geben wäre das Klasse.
      Gruß vom Oldie Halweks

      Kommentar


      • #4
        backbone tutorial auf deutsch?
        http://ewus.de/book/export/html/459
        die winery hab ich nicht grefunden, möglicherweise hilft dir aber das deutsche tut, die winery zu verstehen?

        ich hab fotos von ausstellungen, auf denen bilder sind, welche auf der selben hompage verlinkt werden:
        Code:
        /* die ansichten aus der austellung: */
        var ansicht = Backbone.Model.extend({
               defaults: {
                 title: "noTitle",
                 picture: pictureModel,
                 workpieces : [{name: "", link: ""}],
                 sets: [{name:"", link: ""}]
               }
          });
        /* die art wie ich bilder darstelle als model */
          var pictureModel = Backbone.Model.extend({
            defaults: {
        
                path: "",
                urlBase: "",
                alt: "",
                jit: "",
                relation: "",
                src: '',
                hash: ''
            },
            initialize: function(opts) {
              this.fit = opts.fit || false;
              this.alt = (_.isUndefined(opts.alt))? "this_image_has_no_alt" : opts.alt;
        
            }
        
        });
        
        /* das template (ist teil des view -- bitte tutorial lesen --) eines einelnen bildes */
        
          template: function(model) {
        //     console.debug(model);
            var tpl = '<img alt="<%= picture.alt %>" src="<%= picture.urlBase %><%= picture.jit %><%= picture.path %>" />';
            return _.template(tpl, model);
          },
        /* das tempalte mit den inhaltlichen verknüpfungen (s.o.) */
                 template:  function(model){
        
                  var strTpl = '<ul><li class="list"> \
                   <div id="picture" class="fit">\
                   <img alt="<%= picture.alt %>" src="<%= picture.attributes.urlBase %><%= picture.attributes.jit %><%= picture.attributes.path %>" /></div>';
                    strTpl += '</li><li class="list"><ul><li>\
                    <% for(var tag in workpieces) { %>\
                       <li><a href="<%= workpieces[tag].link %>"> <%= workpieces[tag].name %> </a> </li>\
                    <% } %></li><li>\
                    <% for(var tag in sets) { %>\
                       <li><%= sets[tag].name %></li>\
                    <% } %>\
                    </ul></li></ul>';
                   return _.template(strTpl, model.attributes);
                 },
        hope this helps....

        Kommentar


        • #5
          Prima, so holft man alten Herren auf's Pferd.
          Danke

          Kommentar

          Lädt...
          X