No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    1. Home
    2. jubalj
    J
    • Profile
    • Following 0
    • Followers 0
    • Topics 0
    • Posts 3
    • Best 1
    • Groups 0

    jubalj

    @jubalj

    1
    Reputation
    3
    Profile views
    3
    Posts
    0
    Followers
    0
    Following
    Joined Last Online

    jubalj Follow

    Best posts made by jubalj

    • RE: How to select text on focus in a QInput

      Posting for someone else looking for a simpler solution as I found a solution;

      Add the following to inside the <q-input>

      @focus="(input) => input.target.select()"

      Found it at https://github.com/quasarframework/quasar/issues/8402

      posted in Help
      J
      jubalj

    Latest posts made by jubalj

    • RE: How to use q-uploader to upload a file to Amazon S3

      The following code works for me - but it is not tidy - I am still getting my head around some js concepts and realise that someone will be able to provide a more concise solution, but seeing as this is unanswered for a couple of years I’ve posted my code. It lets a user upload a single picture upto 5mb, and updates the displayed profile picture from the uploaded image. I have also included the code I use to update the Cognito attributes.

      I also encountered a s3 bucket issue when using amplify solved by https://github.com/aws-amplify/amplify-js/issues/960#issuecomment-421843145

      Below is the code that works for me - Hope this if helpful

      In template:

      <q-uploader ref="uploadedImage" max-file-size="5242880" auto-upload :factory="updatePicture" label="Upload profile picture" accept="image/*"  />
      

      In script:

      function updatePicture(files) {
            pictureURL.value = onFileChange(files).resolve;
          }
          async function onFileChange(files) {
            console.log("uploading")
            const file = files[0];
            //console.dir(files);
            try {
      
         let response = await Storage.put(uid.value + file.name, file, {
             //acl: "public-read",
            contentType: file.type, // contentType is optional
         });
              console.log("uploaded");
              console.log(response);
              response  = getURL(response.key).then((url) => {
                console.log("url " + url);
                return url;
              });
      
         console.log("Uploaded with URL" + response);
                  return response;
            } catch (error) {
          console.log("Error uploading file: ", error);
        }
          };
      
      async function getURL(key) {
            try {
              const url = await Storage.get(key);
              console.log("url from getURL" + url.substring(0,url.lastIndexOf('?')));
              pictureURL.value = url.substring(0,url.lastIndexOf('?'));
            } catch (error) {
              console.log("Error getting url: ", error);
            }
      
      

      As a bonus - here is the function I use to update the cognito attributes

      async function  updateProfile() {
            const  user  = await Auth.currentAuthenticatedUser();
            console.log("updating profile " + firstname.value + " " + lastname.value);
            Auth.updateUserAttributes(user, {
              given_name: firstname.value,
              family_name: lastname.value,
              picture: pictureURL.value,
              name: firstname.value + " " + lastname.value,
            })
              .then(() => {
                console.log("updated profile");
              })
              .catch((err) => {
                console.log("error updating profile");
                console.log(err);
              });
          };
      
      posted in Help
      J
      jubalj
    • RE: QDate formatting to something other than YYYY/MM/DD?

      Same issue, just curious if there is a better solution in the current quasar version?

      posted in Help
      J
      jubalj
    • RE: How to select text on focus in a QInput

      Posting for someone else looking for a simpler solution as I found a solution;

      Add the following to inside the <q-input>

      @focus="(input) => input.target.select()"

      Found it at https://github.com/quasarframework/quasar/issues/8402

      posted in Help
      J
      jubalj