Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Tadjiev Codes
Tadjiev Codes
9,626 Points
Posted by Tadjiev Codes
Tadjiev Codes
9,626 Points

JavaScript Forms and Objects related question

First, In function createParcel() is my parseFloat for variable create weight on line 54 working? 2) Line: 71 line:74, I'm not sure why I can't get the values from the forms and why it's not working? Seems like the whole function doesn't execute like I want it to be doing. It should have added the new parcel to the object stored in the parcels array and again get it displayed in the display output area with other parcels. Only displayParcels() function seems to be working fine and displaying accordingly if one of the choices of dropdown selected. Third of all, my processParcel() function on line:280 doesn't work as well again Using the tracking number entered, find the parcel in the array with the matching number and use it for processing. //check for match // Find the parcel in the array that matches the tracking number provided //Assign the new status to the parcel’s status property Calculate the Cost of shipping for this parcel: o Flat rate of $5 o Add $10, If the parcel has Express Shipping. o Add $0.05 per gram(g) that the parcel weighs o Apply Tax (13%) ● Alert the user with the Tracking Number and the cost of shipping. Call the displayParcels() function The link to the workspace: https://w.trhou.se/hnf9zciyag

If somebody can fix the errors and explain my mistakes, please🙏🙏🙏🙏🙏🙏

Xavier Ritch
Xavier Ritch
11,099 Points

after having a quick look. your constructor method on line 1 was declared using the function keyword instead of class keyword?

3 Answers

Steven Parker
Steven Parker
231,271 Points
Steven Parker
Steven Parker
231,271 Points

The big "if/else if" chain is testing "destinationParcel.value", but "destinationParcel" is a string and does not have a "value" attribute.

But you don't need all the conditional processing anyway. This one line will add the new parcel with any data:

        parcels.push(new Parcel(generateTrackingNumber(), 'Processing', destinationParcel,
                                createWeight, expressShipping));
Tadjiev Codes
Tadjiev Codes
9,626 Points
Tadjiev Codes
Tadjiev Codes
9,626 Points

Good Morning, Mr.Steven) Hope you're doing great) Yes now it works perfectly as u said with just one line WOW without any conditionals) The expressShipping returns null. Is it possible to let it return true if the checkbox is checked and false if it's not checked? Many thanks and regards🙏🙏🙏

Steven Parker
Steven Parker
231,271 Points
Steven Parker
Steven Parker
231,271 Points

You just need to select the "checked" property of the element:

    var expressShipping = document.getElementById('createParcel_expressShipping').checked;
Tadjiev Codes
Tadjiev Codes
9,626 Points
Tadjiev Codes
Tadjiev Codes
9,626 Points

Yes, that's the old-style way of declaring the constructors. The new way is through Classes

Tadjiev Codes
Tadjiev Codes
9,626 Points
Tadjiev Codes
Tadjiev Codes
9,626 Points

Thanks a lot, Mr.Steven. And the rest I did like this for the function processParcel() 

function processParcel() {
    // Targeting DOM Elements through getElementById
    const gettingTrckNum = document.getElementById('tbTrackingNumber');
    //const getDropdown = document.getElementById('processParcel_Status');
    const getDropdown = document.getElementById('processParcel_Status').selectedIndex;
    // Could be useful to indicate which option has been selected fromt the dropdown list
    const Options = document.getElementById('processParcel_Status').options;
    // It's a bit more complex with .options and .selectedIndex how i'm tracking the change of the dropdown I could use just .value
    // But this is another approach that I just learned

    let expressShippingPrice = 0;

    const HST_TAX = 0.13;
    const costOfShipping = 5;
    const pricePerGram = 0.05;

    for (let i = 0; i < parcels.length; i++) {
        const TemporaryElement = parcels[i];
        if (TemporaryElement.trackingNumber == gettingTrckNum.value) {

            TemporaryElement.status = Options[getDropdown].text;
            // Assigning the new status through thsi method if it equals again which changes inside of the object the status and shows after clicked OK

            if (TemporaryElement.express == true) {
                expressShippingPrice = 10; // if in case express equals true the price equals 10
            }
            const totalPrice =
                costOfShipping + expressShippingPrice + (TemporaryElement.weight * pricePerGram);
            const total = (totalPrice * HST_TAX) + totalPrice;
            alert(`Shipping for parcel: ${TemporaryElement.trackingNumber}
              $${total.toFixed(2)} and Status is:  ${Options[getDropdown].text}`);
        }
    }
    // Calling the displayParcels here again
    displayParcels();
}

Now all seem to be working fine thankfully