Assigning value of filescount to a variable

JohnZeman · October 06, 2017, 05:44:44 PM

I'm trying to assign the total number of files assigned to one specific category to variable x.

I see the results I want in the result window but I'm not able to assign the filescount to var x.

And obviously I'm doing something wrong.

Thanks in advance to anyone who can point out what I'm doing wrong here.

Code Select

            // my testing grounds
            $('#btn-ztest').click(function() {
               IMWS.get('v1/categories', {
                  id: '1117',
                  fields: 'id,name,filescount'
               }).then(function(response) {

                     var x = response.filescount;
                     alert(x);
                  //    console.log(x);
                     resultInfo.text(JSON.stringify(response, null, 2));

                  },
                  function(error) {
                     displayError(error);
                  });
            });

ubacher · October 06, 2017, 06:18:08 PM

You have x as a local variable so you won't see it outside of the local scope {}. (My guess).

Mario · October 06, 2017, 06:21:28 PM

response.filescount must be response.filesCount

IMWS always produces JSON with camelCase identifiers. Only the parameters you send to IMWS are all lower-case, to support all languages.
JavaScript is case-sensitive.

Tip: You can see the response from IMWS in your browser's debugger preview. I did a

Code Select


    IMWS.get('v1/categories',{
        path: '@Keywords',
        fields: 'id,name,filescount'

and this is what came back:

Very helpful for debugging or for seeing what's going on.

JohnZeman · October 06, 2017, 07:07:39 PM

Thanks, but I'm still missing something here as now my end result is "undefined"

Below is the entire body section of my test app along with a screen shot of what I see when I run the app.

Code Select

<body>
   <div class="container">

      <p id="john"></p>

      <button id="btn-ztest" class="btn btn-default btn-sm">Test</button>

      <hr>

      <div class="col-xs-6">
         <pre id="result"></pre>
      </div>

      <script>
         $(document).ready(function() {

            var resultInfo = $('#result');

            // my testing grounds
            $('#btn-ztest').click(function() {
               IMWS.get('v1/categories', {
                  id: '1117',
                  fields: 'id,name,filescount'
               }).then(function(response) {
                     document.getElementById('john').innerHTML = response.filesCount;
                     resultInfo.text(JSON.stringify(response, null, 2));
                  },
                  function(error) {
                     displayError(error);
                  });
            });

         });
      </script>

   </div>
</body>

Mario · October 06, 2017, 07:23:17 PM

Remember: The /categories endpoint can return any number of categories. So it returns an array named categories.

See my debugger output above. I query @Keywords so the array has one element. If you query multiple categories, the array holds one element for each category.
The data you have requested is then in that element. See my debugger screen shot above.
The test for response.categories.length is just in case the category you request does not exist.

if (response.categories.length > 0) {
// At least one category found.
// Access the first returned category in that array and set the fileCount as the text for the DOM element with the id 'john'.

$('#john').text( response.categories[0].filesCount );
}

You're mixing jQuery with plain DOM access. I suggest you stick to jQuery and do a simle

$('john').text( 'Hi!' );

instead of

document.getElementById('john').innerHTML = 'Hi!';

JohnZeman · October 06, 2017, 07:41:59 PM

Ah, there we go!

That solves my problem and hopefully I've learned a little something too.

Thanks Mario!

Mario · October 07, 2017, 07:42:46 AM

I can recommend to write apps while viewing them in your web browser (Chrome, FF). This way you can use the built-in debugger to see what your app sends to the server and what comes back (Network tab), and you can also see the contents of variables like response in this case. This takes out a lot of the guesswork and makes programming a lot simpler.

JohnZeman · October 07, 2017, 04:53:32 PM

Thanks Mario, I've been playing a bit with the Chrome debugger but see I have a lot to learn about it yet.

Good project for me on this rainy Saturday though.