Establishing the null values for input parameters

Whenever the button is clicked, I want to reset the input values to null. The function spremi() gets triggered when the button is clicked, but I want to set the values of podaci.tezina and podaci.mamac back to their initial values so that the user can enter new data.

 .controller('SpremiCtrl', function($scope, $localStorage, $ionicPopup, $location, $window) {


    $scope.ribe = ["Saran", "Stuka", "Som"];

    var ribice = [];

    $scope.spremi = function(t_tezina, m_mamac){

          console.log(t_tezina);
          console.log(m_mamac);
          var podaci = {Tezina: t_tezina, Mamac: m_mamac};  
          console.log(podaci);
          ribice.push(podaci);

          $localStorage.fish = ribice;
          console.log(ribice);

    var confirmPopup = $ionicPopup.alert({
    title: 'Saved'

         });
       };

 html

<ion-view view-title="Browse">
      <ion-content>
      <select id="vrstaribe" ng-model="selekt" ng-options="r as r for r in ribe" selected>
       <option value="">Fish Type</option> 
      </select>
       <label class="item item-input">
       <input id="tezina" type="number" placeholder="Weight" ng-model="podaci.tezina">
       </label>
       <label class="item item-input">
       <input id="mamac" type="text" placeholder="Bait" ng-model="podaci.mamac">
       </label>
       <button class="button button-positive" ng-click="spremi(podaci.tezina, podaci.mamac)">Save</button>
       <button class="button button-positive" ng-click="retrieve()">Show</button>
       <button class="button button-positive" ng-click="reset()">Reset</button>

      </ion-content>
    </ion-view>

Answer №1

For optimal performance, make sure to reset all values at the conclusion of your method, following any other operations, in order to prepare for the next invocation.

$scope.saveData = function(weight, bait){
    console.log(weight);
    console.log(bait);
    var data = {Weight: weight, Bait: bait};  
    console.log(data);
    fishData.push(data);

    $localStorage.fish = fishData;
    console.log(fishData);

    var confirmPopup = $ionicPopup.alert({
        title: 'Data Saved'
    });

    // Reset variables here.
    data.Weight = '';
    data.Bait = '';
};

Additionally, consider utilizing $log.debug() (or similar functions) instead of console.log(). This allows you to easily disable debug output by configuring the $logProvider, particularly valuable when transitioning from development to production environments.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Techniques for dynamically counting rows in a table using JavaScript

I'm working on a system to create and delete rows, and I want each row to have a unique row number displayed under "Num." However, I'm having trouble implementing this feature. EDIT I found a jQuery snippet that counts the first row but not t ...

Ensure that the value of a variable in the Ionic/Angular template has been properly initialized

I am currently facing an issue: I have an array of blog posts. Some of them have photos, while others do not. I aim to display the first photo if any are set. How can I verify whether the URL value in my array is set? <ion-header> <ion-navbar& ...

What is the most effective way to prevent actions while waiting for ajax in each specific method?

Within my JS component, I have various methods that handle events like click events and trigger ajax requests. To prevent the scenario where multiple clicks on the same button result in several ajax requests being fired off simultaneously, I typically use ...

Selenium Python Slider Button Element Visibility Issue

Currently, I am developing a parser to automate the process of clicking buttons on a website. However, I am encountering difficulties in clicking two specific buttons. The buttons I am aiming to click are "Elija el imports a financiar" and "Elija la mensu ...

Using webpack to access a bundled React class in an HTML file

Is there a way to access pre-built components directly within the HTML file that links to the build? I've been attempting the following - Inside bundle.js var React = require('react'); var ReactDOM = require('react-dom'); ...

Tips for avoiding Google Tag Manager from interfering with document.write() function

We have integrated Angular into our website, however, not all pages have been migrated to Angular yet. To handle this situation, we have implemented a hybrid approach: Each request is initially directed to Angular. Once the page is loaded, it checks if th ...

Convert the websocket factory in angularjs to a socket.io factory

The backend is utilizing nodejs and socket.io, so I need to modify the frontend websocket service to use socket.io as well. However, I am encountering some issues. The websocket factory code snippet is provided below: app.factory("WebSocketDataProvider" ...

Issue encountered while attempting to include a background image in React JS

I encountered an issue when attempting to include a background image in react js. ./src/index.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss!./src/index.css) Unable to locate module: An attem ...

Is it feasible to alter the TypeScript interface for the default JavaScript object (JSON)?

When dealing with cyclic objects, JSON.stringify() can break (as mentioned in https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Cyclic_object_value) An alternative solution suggested in the same article is to use 'cycle.js&apos ...

Using Swig's conditional extend tag with Express.js and Node.js to leverage dynamic content rendering

Is there a way to make the extend tag for the Swig templating engine conditional or able to use a passed variable? Instead of using this code: {% extends '../layouts/layout.view' %} I would prefer to do something like this: {% extends layout ...

Manipulating classes within ng-class in AngularChanging classes in ng-class dynamically

Featuring multiple elements with an ng-class that behaves similarly to a ternary operator: ng-class="$ctrl.something ? 'fa-minus' : 'fa-plus'" To access these elements, we can compile all the ones with fa-minus and store them in a lis ...

What is the process for including body text in a Bootstrap tooltip?

I am attempting to enhance a Bootstrap tooltip by adding body text, as it typically only includes a basic title. After reviewing the Bootstrap 5 documentation, it seems that the simplest approach is to utilize the template option: template Base HTML used ...

Simple Express Path Challenge

I've hit a roadblock in my JavaScript tutorial on Mozilla and could really use some assistance. Below are excerpts from 3 different files: a) In the app.js file, I am trying to locate Router handlers and then present them: //app.js //the fol ...

A guide on implementing a .click function with jQuery

I have a code snippet that is supposed to add 100 to a number in a MySQL table when a button is clicked. However, the code does not work as expected. When I click the button, nothing happens, but if I refresh the page, it adds 100 to the number. Can some ...

An ultimate guide to mapping a nested array in React.js

Problem: I am struggling to display the entire content of my array. The goal is to render all elements in the array, but so far I can only get one to show up. I have found that including [key] in the object fields is the only way to generate any output. ...

Setting the maximum width for a JavaScript pop-up box

Below is the html code that creates a link reading "sacola de compras" <div> <script type="text/javascript" src="https://app.ecwid.com/script.js?4549118"></script> <script type="text/javascript"> xMinicart("style=","layout=Mini") ...

Change a Character or Word in JavaScript after it's been typed

If I were to type the word "hello" into a textarea, is there a way for me to select that specific word and modify it afterwards? For instance, let's say I typed hello without hitting the space bar; could the system recognize this word and automaticall ...

The Strapi registration feature in version 4 is giving a "method not allowed 405" error, which

Feeling a bit confused with a Strapi query. I am currently working on v4 and trying to set up a registration feature. The code snippet for invoking the function is provided below. Everything seems fine, such as submitting function variables, etc. However, ...

Problem encountered while attempting to sort a table with JavaScript and jQuery

Having trouble sorting my table by the content in the first column. I've tried implementing code similar to the one found in this ANSWER, but unfortunately, it's not working as expected for me. When you run the snippet, you can see that the table ...

Struggling to set a variable during the loading of a page in AngularJS

I'm facing an issue with initializing a variable called showName when the page loads. It was working perfectly fine with just Angular, but as soon as I integrated it with Rails (using embedded Ruby tags), the text field and save button are not being h ...