Announcement

Collapse
No announcement yet.

JQuery Enabling a conditional?

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    JQuery Enabling a conditional?

    I'm using jquery to populate a value from a click event:

    $('#RepeatEvent').val(event.repeatflag);

    where the value of event.repeatflag is 1 or 0.

    The click event loads a modal popup where this code executes.

    #RepeatEvent is an input where the default value of Value attribute is NULL.
    The input value populates as expected -- so it's working.

    What isn't working in the template is a conditional when the input value is true ( or 1 ).

    Code:
      <div class="repeatevent"><input id="RepeatEvent" type="text" value="" name="repeated"></div>
      <mvt:assign name="g.eventsuccess" value="trim(repeated)" />
        <div id="therepeat"><mvt:eval expr="repeated $ '| test:' $ g.eventsuccess" /></div>
      <mvt:if expr="g.eventsuccess">
         // render something here //
      </mvt:if>
    The mvt:eval renders with null values, so I am not sure I'm assigning the variable correctly? Ideas?

    Thanks,

    Scott
    Need to offer Shipping Insurance?
    Interactive Design Solutions https://www.myids.net
    MivaMerchant Business Partner | Certified MivaMerchant Web Developer
    Competitive Rates, Custom Modules and Integrations, Store Integration
    AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
    My T-shirt Collection is mostly MivaCon T-shirts!!

    #2
    I don't fully understand your code snippet. But I can tell you that mvt:if's are executed while the page is being rendered, well before JS code in the page begins to run. So you can't write an mvt:if that tests a variable "now" if the value will be set "later" by JS.

    HTH --
    Kent Multer
    Magic Metal Productions
    http://TheMagicM.com
    * Web developer/designer
    * E-commerce and Miva
    * Author, The Official Miva Web Scripting Book -- available on-line:
    http://www.amazon.com/exec/obidos/IS...icmetalproducA

    Comment


      #3
      That is what I was thinking until you add a value instead of NULL to the input.
      This makes the default value true (IDS) with some content. The eval should now be:

      IDS | test:

      when the modal is triggered.

      I am not sure what explains that. The actual value of the input hasn't been rendered differently as far as I can tell. Gotta be something subtle I'm missing.


      Code:
       
         <div class="repeatevent"><input id="RepeatEvent" type="text" value="IDS" name="repeated"></div>   <mvt:assign name="g.eventsuccess" value="trim(repeated)" />     <div id="therepeat"><mvt:eval expr="repeated $ '| test:' $ g.eventsuccess" /></div>   <mvt:if expr="g.eventsuccess">      // render something here //   </mvt:if>

      Another thought, How would I ajax (reload) the page before the modal is triggered?

      This is the last line of the click function.

      Code:
      $('#RepeatEvent').val(event.repeatflag);
      $('#EventClickModal').modal();
      If possible, I am guessing I would need to ajax the page before the modal is triggered?

      Code:
      $('#RepeatEvent').val(event.repeatflag);
      // do an ajax reload here? //
      $('#EventClickModal').modal();
      Scott
      Need to offer Shipping Insurance?
      Interactive Design Solutions https://www.myids.net
      MivaMerchant Business Partner | Certified MivaMerchant Web Developer
      Competitive Rates, Custom Modules and Integrations, Store Integration
      AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
      My T-shirt Collection is mostly MivaCon T-shirts!!

      Comment


        #4
        Are you posting this value through CGI? If so, are you sure they name/value is 'repeated' and if so, why not just use 'g.repeated'?
        Bruce Golub
        Phosphor Media - "Your Success is our Business"

        Improve Your Customer Service | Get MORE Customers | Edit CSS/Javascript/HTML Easily | Make Your Site Faster | Get Indexed by Google | Free Modules | Follow Us on Facebook
        phosphormedia.com

        Comment


          #5
          I've made that assumption actually. Without changing anything via jquery, the failed condition renders in this example. Looks like mivascript doesn't know about the cgi var 'repeated.'


          Code:
          <input id="RepeatEvent" type="text" value="IDS" name="repeated"></div>
          <mvt:if expr="repeated">
          <div id="therepeat1"><mvt:eval expr="repeated'" /></div>
          <mvt:else>
          <div id="therepeat2"><mvt:eval expr="'not _ ' $ repeated" /></div>
          </mvt:if>
          Need to offer Shipping Insurance?
          Interactive Design Solutions https://www.myids.net
          MivaMerchant Business Partner | Certified MivaMerchant Web Developer
          Competitive Rates, Custom Modules and Integrations, Store Integration
          AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
          My T-shirt Collection is mostly MivaCon T-shirts!!

          Comment


            #6
            I tried this:

            location.reload();

            The reload reloads the page but kills the modal so it isn't really a solution. I've seen it is possible to restrict an AJAX reload to a container, a DIV with an ID. Will Empressa rerun the mivascript/smt code in that container only?

            Thanks,

            Scott
            Need to offer Shipping Insurance?
            Interactive Design Solutions https://www.myids.net
            MivaMerchant Business Partner | Certified MivaMerchant Web Developer
            Competitive Rates, Custom Modules and Integrations, Store Integration
            AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
            My T-shirt Collection is mostly MivaCon T-shirts!!

            Comment


              #7
              Not very sure what you're trying to achieve...
              But as it was said earlier, miva's if is rendered on the server, and JS is output and rendered in a browser. Same with DOM elements, for Miva it's just pure "text"

              so...

              Code:
              <script>
                  <mvt:assign name="g.my_var" value="1" />
                  <mvt:if expr="g.my_var EQ 1">
                      console.log('value is equal to 1');
                  <mvt:else>
                      console.log('this part of javascript code will never reach customers browser');
                  </mvt:if>
              </script>
              knowing that miva renders the code first it's a very nice way of populating some JS variables

              Code:
              <script>
                  var my_var = 0;
                  <mvt:if expr="g.product_category EQ 'MYCODE'">
                      my_var = '&mvt:global:product_code;';  // yes, 2 semicolumns here: one for miva, one for javascript
                  </mvt:if>
                  console.log(my_var);  // will output 0 here to the browser console if category is not MYCODE and will output g.product_code if category match
              </script>

              But again... what is the task?
              Last edited by AHerb; 01-10-18, 10:14 AM.

              Comment


                #8
                Background: I'd like to try and keep the template as simple or at least straightforward as possible for maintainability. So, I'd rather use a mivascript/smt solution if it's possible and leave the jquery to a minor tool.

                The task at hand is to display the relevant content/code based a click event inside a modal. We know html has already been generated for the page/modal. The default value of a variable has already rendered. Changing the value of an input with jquery after the fact and trying to process an MVT: IF after won't bring any joy. If this were to work I would need the page to re-render at least that section somehow so the IF would evaluate the new value of the variable. I thought I might accomplish this with AJAX. That solution is elusive at the moment. My current fallback solution will likely be to generate all the possibilities and use the click event values bound to selectors/classes to show the proper content container in the modal. If you guessed I'm looping through a product array you can imagine if there are many products the modal code could be very large. Hence, my concern.

                So here's another question. The data being passed to the modal is from a JSON. If I were able to create the content possibilities in the JSON string, and there were many, is it better for page performance to store the content in the potentially long string of data or have the possibilities in DIVs for example in the modal? I am thinking the size of the page won't be that much different in each. But if the content is treated differently, there would be less penalty one way over the other? Another way to ask this question: 100 extra lines of html in the body or 100 extra lines of JSON in a doc ready script?

                Scott
                Need to offer Shipping Insurance?
                Interactive Design Solutions https://www.myids.net
                MivaMerchant Business Partner | Certified MivaMerchant Web Developer
                Competitive Rates, Custom Modules and Integrations, Store Integration
                AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
                My T-shirt Collection is mostly MivaCon T-shirts!!

                Comment


                  #9
                  To simplify: you want to click a "button" on a modal which will populate a content block width different data, but without page reloading, right?

                  If the data is not massive and will not require long time to be processed/prepared by Miva machine, you could just generate and pass it as JSON while the page is loading.
                  If the data is massive, you could load minimum required part when the page loads, and pull requested part when appropriate "button" is clicked (AJAX).
                  If the data is massive and not very dynamic you could prepare JSON string once a day/hour and store it as TXT file somewhere on the server with good caching rules, letting the web browser load it only when it's needed.

                  ---------------------------------

                  Normally, for 100 lines it doesn't matter.
                  But if we're talking thousands, performance-wise JSON is preferable, as html DOM requires much more time/memory/processor to be rendered and stored.

                  Comment


                    #10
                    Thanks AHerb,


                    That helps with a longer term large dataset strategy. Firstly, the CTA button in the modal, in this case, will link to a specific page. The data needs to load when the modal is triggered. In this initial application, the dataset will probably never reach 100 JSON records at any time the page is rendered.

                    Scott
                    Need to offer Shipping Insurance?
                    Interactive Design Solutions https://www.myids.net
                    MivaMerchant Business Partner | Certified MivaMerchant Web Developer
                    Competitive Rates, Custom Modules and Integrations, Store Integration
                    AutoBaskets|Advanced Waitlist Integration|Ask about Shipping Insurance Integration
                    My T-shirt Collection is mostly MivaCon T-shirts!!

                    Comment

                    Working...
                    X