Jasonette / JASONETTE-iOS

📡 Native App over HTTP, on iOS
https://www.jasonette.com
MIT License
5.27k stars 352 forks source link

$reload doesn't seem to reload footers #336

Closed tomcam closed 6 years ago

tomcam commented 6 years ago

It would appear that $reload doesn't refresh the footer? According to the $reload docs it is supposed to refresh the view completely, and I think the footer is considered part of the view?

Here is the sample code (also copied below). If I change the contents of the header on Jasonbase, save, then click the Reload button, the header is rewritten. But if I change the button text, say from "Send" to "Zend", nothing happens.

{
  "$jason": {
    "head": {
      "title": "footer",
      "description": "Jasonette simple footer example"
    },
    "body": {
      "header": {
        "title": "Change button name to Zend, then click Refresh"
      },
      "sections": [
        {
          "items": [
            {
              "type": "button",
              "text": "Refresh",
              "action": {
                "type": "$reload"
              }
            }
          ]
        }
      ],
      "footer": {
        "input": {
        },
        "right": {
          "text": "Send",
          "action": {
            "type": "$reload"
          }
        }
      }
    }
  }
}

What am I doing wrong?

gliechtenstein commented 6 years ago

Thanks for reporting. There are two issues here:

  1. The right button doesn't display text correctly
  2. Reloading doesn't refresh the bottom input field content

The first issue is because you put right directly under footer. The footer refers to the entire bottom footer area which either can be a tab bar or an input field.

In your case because the right button belongs to the input field component, it should be under footer.input, like this: https://jasonbase.com/things/VJop

{
  "$jason": {
    "head": {
      "title": "footer",
      "description": "Jasonette simple footer example"
    },
    "body": {
      "header": {
        "title": "Change button name to iZend, then click Refresh"
      },
      "sections": [
        {
          "items": [
            {
              "type": "button",
              "text": "Refresh",
              "action": {
                "type": "$reload"
              }
            }
          ]
        }
      ],
      "footer": {
        "input": {
          "right": {
            "text": "Zend",
            "action": {
              "type": "$reload"
            }
          }
        }
      }
    }
  }
}

As for the second issue, this was an edge case which depending on how you look at it can be considered a bug or not, This wasn't super problematic because when you have an input field you normally also specify the name attribute so you can use the value when you submit. In this particular example you didn't specify the name attribute so the action wasn't triggering. (The rationale was that: no one would use the footer input component without assigning a variable name to it, but I can see how it can be confusing)

Anyway, I've fixed that case now so if you pull from develop AND use the correct markup I posted above, you should be able to see it work.

tomcam commented 6 years ago

You're amazing! Thank you very much.